主页:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>识货-高性价比商品导购</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
.body{
width: 1519px;
height:3191px;
background-color:orange;
margin: 0 auto;
}
.shihuo-nav-area{
width: 1519px;
height: 125px;
background-color: yellowgreen;
margin: 0 auto;
}
.top-nva-list-small-index{
width: 1519px;
height: 75px;
background-color: yellow;
margin-top:3px;
margin-bottom: 3px;
}
.shihuo-content-warp{
width: 1519px;
height: 2532px;
background-color: green;
margin-top:6px;
margin-bottom: 6px;
}
.main{
width: 1080px;
height: 2512px;
background-color: blue;
margin: 0 auto;
}
.top-block{
width: 1080px;
height: 340px;
background-color: red;
margin: 0 auto;
}
.left-menu{
width: 250px;
height: 340px;
background-color: brown;
float: left;
}
.center-banner{
width: 540px;
height: 340px;
background-color: orange;
float: left;
margin-left:10px;
margin-right:10px;
}
.right-block{
width: 270px;
height: 340px;
background-color: brown;
float: left;
}
.list-block{
width: 1080px;
height: 2162px;
background-color:yellow;
margin-top:5px;
}
.list-array{
width: 800px;
height: 2102px;
background-color:red;
}
.list-youhui{
width: 770px;
height: 302px;
background-color:brown;
margin: 6px 6px 6px 6px;
border: white solid 6px;
}
.list-v1{
width: 770px;
height: 210px;
background-color:orange;
margin: 6px 6px 6px 6px;
border: white solid 6px;
}
.list-v2{
width: 770px;
height: 210px;
background-color:brown;
margin: 6px 6px 6px 6px;
border: white solid 6px;
}
.list-v3{
width: 770px;
height: 210px;
background-color:orange;
margin: 6px 6px 6px 6px;
border: white solid 6px;
}
.list-v0{
width: 770px;
height: 350px;
background-color:orange;
margin: 6px 6px 6px 6px;
}
.a1{
width: 200px;
height: 310px;
background-color:orange;
margin: 6px 6px 6px 6px;
border: white solid 6px;
float: left;
}
.a2{
width: 200px;
height: 310px;
background-color:orange;
margin: 6px 6px 6px 6px;
border: white solid 6px;
float: left;
}
.a3{
width: 200px;
height: 310px;
background-color:orange;
margin: 6px 6px 6px 6px;
border: white solid 6px;
float: left;
}
.list-v4{
width: 770px;
height: 210px;
background-color:orange;
margin: 6px 6px 6px 6px;
border: white solid 6px;
}
.list-v5{
width: 770px;
height: 210px;
background-color:orange;
margin: 6px 6px 6px 6px;
border: white solid 6px;
}
.list-v6{
width: 770px;
height: 210px;
background-color:orange;
margin: 6px 6px 6px 6px;
border: white solid 6px;
}
.jxhw{
width: 260px;
height: 504px;
background-color:orange;
margin-bottom: 10px;
border: white solid 6px;
float: right;
}
.hot-group{
width: 260px;
height: 504px;
background-color:orange;
border: white solid 6px;
float: right;
}
.right-block1{
width: 300px;
height: 1223px;
background-color:orange;
margin-left:10px;
float: right;
}
.footer{
width: 1519px;
height: 448px;
background-color:yellow;
}
.logos-box{
width: 1080px;
height: 85px;
background-color: #edd6d6;
margin: 0 auto;
}
.nav-area{
width: 1519px;
height: 40px;
background-color:red;
margin: 0 auto;
}
.area-min{
width: 1080px;
height: 40px;
background-color:red;
margin: 0 auto;
}
.nav-area-right{
width: 102px;
height: 40px;
background-color:red;
float: right;
}
.unsign{
width: 87px;
height: 40px;
background-color:red;
text-align: center;
line-height: 35px;
margin: 0 auto;
float: left;
}
.unsign a{
/* display: block; */
width: 100%;
text-decoration: none;
color: white;
font-weight: bold;
}
.nav{
list-style: none;
background-color: red;
width: 768px;
float: left;
overflow: hidden;
}
.nav li{
float: left;
width: 12.5%;
margin: 5px 0 0 0;
}
.nav a{
width: 100%;
text-align: center;
padding: 5px 0;
text-decoration: none;
color: white;
font-weight: bold
}
</style>
</head>
<body>
<div class="body">
<div class="shihuo-nav-area">
<div class="logos-box"></div>
<div class="nav-area">
<div class="area-min">
<ul class="nav">
<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 class="nav-area-right">
<div class="unsign">
<a href="登录识货社区.html">登录 | </a><a href="#">注册</a>
</div>
</div>
</div>
</div>
</div>
<div class="top-nva-list-small-index"></div>
<div class="shihuo-content-warp">
<div class="main">
<div class="top-block">
<div class="left-menu"></div>
<div class="center-banner"></div>
<div class="right-block"></div>
</div>
<div class="list-block">
<div class="right-block1">
<div class="jxhw"></div>
<div class="hot-group"></div>
</div>
<div class="list-array">
<div class="list-youhui"></div>
<div class="list-v1"></div>
<div class="list-v2"></div>
<div class="list-v3"></div>
<div class="list-v0">
<div class="a1"></div>
<div class="a2"></div>
<div class="a3"></div>
</div>
<div class="list-v4"></div>
<div class="list-v5"></div>
<div class="list-v6"></div>
</div>
</div>
</div>
</div>
<div class="footer">
<img src="img/1.png" height="448" width="1519" >
</div>
</div>
</body>
</html>
登录:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>登录识货社区</title>
<style type="text/css">
.bg-img{
width: 1503px;
height: 668px;
}
.user-login{
width: 540px;
height: 623px;
background-color: white;
margin: 0 auto;
padding: 15px 0 0 0;
}
.back-title{
width: 540px;
height: 28px;
background-color: yellow;
}
.back-title a{
color: white;
}
.login-warp{
width: 380px;
height: 510px;
padding: 40px 80px 30px 80px;
background-color: red;
}
.logo{
width: 380px;
height: 54px;
margin-bottom: 40px;
background-color: yellow;
}
.lo{
width: 220px;
height: 54px;
margin: 0 auto;
}
.login{
width: 380px;
height: 337px;
background-color: white;
}
.login-metnod{
width: 540px;
height: 26px;
}
.login-metnod a{
display: block;
color: blue;
text-decoration: none;
float: left;
}
</style>
</head>
<body>
<div class="bg-img">
<div class="user-login">
<div class="back-title">
<a href="xiangmu.html">
<b><<</b>
返回上页
</a>
</div>
<div class="login-warp">
<div class="logo">
<div class="lo">
<img src="img/logo-shihuo.png">
</div>
</div>
<div class="login"></div>
<div class="login-metnod">
<a href="#">微信登录 </a>
<a href="#">qq登录 </a>
<a href="#">手机短信快捷登录</a>
</div>
</div>
</div>
</div>
</body>
</html>
网友评论