🎉
不定期分享源码，关注不丢失哦
文章目录
- 一、作品介绍
- 二、作品演示
- 三、代码目录
- 四、网站代码
- HTML部分代码
- 五、源码获取
一、作品介绍
🏷️本套采用HTML+CSS，未使用Javacsript代码，共有1个页面。
二、作品演示
三、代码目录
四、网站代码
HTML部分代码
<div class="nav">
<div class="navCenter">
<ul>
<li><a href="#">小米官网</a><span>|</span></li>
<li><a href="#">小米商城</a><span>|</span></li>
<li><a href="#">MIUI</a><span>|</span></li>
<li><a href="#">IoT</a><span>|</span></li>
<li><a href="#">云服务</a><span>|</span></li>
<li><a href="#">天星数科</a><span>|</span></li>
<li><a href="#">小爱开放平台</a><span>|</span></li>
<li><a href="#">企业团购</a><span>|</span></li>
<li><a href="#">资质证照</a><span>|</span></li>
<li><a href="#">协议规则</a><span>|</span></li>
<li><a href="#">下载app</a><span>|</span></li>
<li><a href="#">Select Region</a></li>
</ul>
<div class="login">
<ul>
<li><a href="#">登录<span>|</span></a></li>
<li><a href="#">注册</a><span>|</span></li>
<li><a href="#">消息通知</a></li>
</ul>
<div class="shoppingCart">
购物车( 0 )
</div>
</div>
</div>
</div>
</header>
<div class="logoNav">
<div class="logo"><img src="images/logo.png" width="52"></div>
<ul>
<li><a href="#">Xiaomi手机</a></li>
<li><a href="#">Redmi手机</a></li>
<li><a href="#">电视</a></li>
<li><a href="#">笔记本</a></li>
<li><a href="#">平板</a></li>
<li><a href="#">家电</a></li>
<li><a href="#">路由器</a></li>
<li><a href="#">服务中心</a></li>
<li><a href="#">社区</a></li>
</ul>
<div class="search">
<input type="search">
<input type="submit" value="搜索">
</div>
</div>
<div class="banner">
<ul class="bannerPic">
<li><img src="images/banner1.jpeg" alt=""></li>
</ul>
<div class="menu">
<ul>
<li><a href="#">手机</a></li>
<li><a href="#">电视</a></li>
<li><a href="#">家电</a></li>
<li><a href="#">电脑 排版</a></li>
<li><a href="#">出行 穿戴</a></li>
<li><a href="#">耳机 音箱</a></li>
<li><a href="#">健康 儿童</a></li>
<li><a href="#">生活 箱包</a></li>
<li><a href="#">智能 路由器</a></li>
<li><a href="#">电源 配件</a></li>
</ul>
</div>
</div>
<div class="suggest">
<ul class="app">
<li><img src="./images/1.png" alt="" width="24"><div>保障服务</div></li>
<li><img src="./images/2.png" alt="" width="24"><div>企业团购</div></li>
<li><img src="./images/3.png" alt="" width="24"><div>F码通道</div></li>
<li><img src="./images/4.png" alt="" width="24"><div>米粉卡</div></li>
<li><img src="./images/5.png" alt="" width="24"><div>以旧换新</div></li>
<li><img src="./images/6.png" alt="" width="24"><div>话费充值</div></li>
</ul>
<ul class="suggestImg">
<li><img src="images/b1.jpg" alt=""></li>
<li><img src="images/b2.jpg" alt=""></li>
<li><img src="images/b3.jpg" alt=""></li>
</ul>
</div>
五、源码获取
🥇 ~ 关注我，点赞博文~ 每天带你涨知识!
🎁1.看到这里了就[点赞+好评+收藏]三连 支持下吧，你的「点赞，好评，收藏」是我创作的动力。
💙2.想要获取本文源码，点击前往吧
