1、效果图：
2、style设计：
<style>
.header{
width: 80%;
margin: auto;
height: 40px;
line-height: 40px;
}
.left{
width: 300px;
float: left;
}
.right{
float: right;
width: 300px;
}
.header a{
text-decoration: none;
color: #777;
}
.container{
width: 80%;
margin: auto;
}
.row_1{
border: solid 1px #111;
background-color: #ccc;
line-height: 40px;
text-align: center;
height: 40px;
}
.col_1{ width: 100px;float: left}
.col_2{width: 500px;float: left}
.col_3{width: 200px;float: left}
.col_4{width: 100px;float: left}
.col_5{width: 100px;float: left}
.col_6{width: 200px;float: left}
.rows{margin-top: 20px;height: 30px}
.rows_shops{height: 120px;border: solid 1px #111}
.ss a{
text-decoration: none;
display: block;
line-height: 30px;
}
</style>
3、body结构：
<body>
<div class="header">
<div class="left">
<a href="#">优选购物欢迎你！</a>
<a href="#" style="color: blue">登录！免费注册</a>
</div>
<div class="right">
<a href="#">我的订单</a>
<span>|</span>
<a href="#" s
最低0.47元/天 解锁文章
1157
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
