75 lines
2.6 KiB
HTML
75 lines
2.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang = "zh_CN">
|
|
<head>
|
|
<meta http-equiv = "Content-Type" content = "text/html;charset=utf-8">
|
|
<title>购物网</title>
|
|
<!--引入重置样式-->
|
|
<link rel="stylesheet" href="./css/reset.css">
|
|
<!--引入样式-->
|
|
<link rel="stylesheet" href="./css/index.css">
|
|
</head>
|
|
<body>
|
|
<!--顶部导航条-->
|
|
<div class="top_bar">
|
|
<!--版心-->
|
|
<div class="container float_clear">
|
|
<!--左侧导航区-->
|
|
<div class="nav_left float_left">
|
|
<span class="welcome">欢迎您</span>
|
|
<a href="#" class="login">请登录</a>
|
|
<a href="#" class="register">免费注册</a>
|
|
</div>
|
|
<!--右侧导航区-->
|
|
<div class="nav_right float_right">
|
|
<ul class="list">
|
|
<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>
|
|
<!--头部区域-->
|
|
<div class="header">
|
|
<!--版心-->
|
|
<div class="container float_clear">
|
|
<!--图标区-->
|
|
<div class="header_logo float_left">
|
|
<img src="./images/logo.png" alt="LOGO">
|
|
</div>
|
|
<!--搜索区-->
|
|
<div class="header_search float_right">
|
|
<form action="#">
|
|
<input type="text">
|
|
<button></button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--主导航-->
|
|
<div class="main_nav">
|
|
<!--版心-->
|
|
<div class="container float_clear">
|
|
<div class="all-type float_left">全部商品分类</div>
|
|
<ul class="main_nav_list float_left">
|
|
<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="#" >PLUS会员</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>
|
|
|
|
</body>
|
|
</html> |