| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>包图网</title>
- <!-- 引入common.css 公共css文件 样式重置 -->
- <link rel="stylesheet" href="css/common.css">
- <!-- 引入页面css -->
- <link rel="stylesheet" href="css/index.css">
- </head>
- <body>
- <!-- 导航 -->
- <div id="nav">
- <!-- 中间内容区域 -->
- <div class="nav-center">
- <!-- 左边 -->
- <div class="nav-left">
- <a href="#" class="nav-left-first">您好，欢迎进入包图购物网</a>
- <a href="#">登录</a>
- <span>|</span>
- <a href="#" class="active">注册</a>
- </div>
- <!-- 右边 -->
- <div class="nav-right">
- <a href="#">设为首页 ☆</a>
- <span>|</span>
- <a href="#" class="active">加入收藏</a>
- <span>|</span>
- <a href="#">客户服务 </a>
- <span>|</span>
- <a href="#" >关注官方微博：</a>
- </div>
- </div>
- </div>
- <!-- 头部开始 -->
- <div class="header">
- <!-- 左边logo -->
- <img class="header-logo" src="images/logo.png" alt="">
- <!-- 中间的搜索容器 -->
- <div class="search-box">
- <!--上边是搜索框 -->
- <div class="header-search">
- <!-- placeholder 占位 -->
- <input class="search-text" placeholder="618活动" type="text">
- <button class="search-btn">搜索</button>
- </div>
- <!-- 下边是列表 -->
- <div class="header-list">
- <a href="#">时尚女鞋</a>
- <a href="#">简易家具</a>
- <a href="#">仙女公主裙</a>
- <a href="#">BF风裤子</a>
- </div>
- </div>
- <!-- 右边的购物车 -->
- <div class="cart-box">
- <img src="images/cart.png" alt="">
- <span>购物车物品</span>
- </div>
- </div>
-
- </body>
- </html>
|
