前端小米商城首页简易模仿

最新推荐文章于 2022-11-18 11:07:43 发布

你的负卿是我

最新推荐文章于 2022-11-18 11:07:43 发布

阅读量1.4k

点赞数 6

分类专栏： web前端文章标签： css html html5 css3

本文链接：https://blog.csdn.net/weixin_43909373/article/details/108087940

版权

前端小米商城首页简易模仿

HTML部分

<!DOCTYPE html>
   <html lang="en">
   <head>
      <meta charset="UTF-8">
     <title>小米商城首页zzy</title>
       <link rel="icon" href="img/favicon.ico">
       <link rel="stylesheet" href="./css/topBar.css">
       <link rel="stylesheet" href="./css/head.css">
       <link rel="stylesheet" href="./css/body.css">
     <link rel="stylesheet" href="./css/foot.css">
  </head>
  <body>
  
     <!-- 顶部导航栏 -->
      <div class="topBar">
          <div class="container1">
              <div class="topBar-nav">
                  
                     <a href="">小米商城</a>
                      <span class="sep">|</span>
                     <a href="">MIUI</a>
                    <span class="sep">|</span>
                      <a href="">loT</a>
                      <span class="sep">|</span>
                      <a href="">云服务</a>
                     <span class="sep">|</span>
                      <a href="">金融</a>
                      <span class="sep">|</span>
                      <a href="">有品</a>
                     <span class="sep">|</span>
                     <a href="">小爱开放平台</a>
                     <span class="sep">|</span>
                     <a href="">政企服务</a>
                     <span class="sep">|</span>
                     <a href="">下载app</a>
                      <span class="sep">|</span>
                     <a href="">select Region</a>
                 
             </div>
             <div class="topBar-cart">
                 <a href="" target="_self">
                      <img src="img/cart.jpg" alt="" id="t-cart">购物车
                  </a>
              </div>
             <div class="user-info">
                 <a href="">登陆</a>
                 <span class="sep">|</span>
                 <a href="">注册</a>
                <span class="sep">|</span>
                <a href="">消息通知</a>
              </div>    
         </div>
     <!-- 头部logo 导航 和商品搜索部分 -->
      <div class="header">
          <div class="container2">
              <!-- logo的盒子 -->
             <div class="logo">
                 <img src="img/logo.jpg" alt="LOGO">
             </div>
              <!-- 下面的是导航的盒子 -->
            <div class="nav">
                  <div class="sub-nav">
                      <a href="">小米手机&nbsp</a>
                    <a href="">红米&nbsp</a>
                    <a href="">电视&nbsp</a>
                     <a href="">笔记本&nbsp

最低0.47元/天解锁文章

你的负卿是我

关注

6
点赞
踩
31

收藏

觉得还不错? 一键收藏
5
评论
前端小米商城首页简易模仿

前端小米商城首页简易模仿HTML部分<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>小米商城首页zzy</title> <link rel="icon" href="img/favicon.ico"> <link rel="stylesheet" href="./
复制链接

扫一扫

专栏目录