前端—盒子
2018-10-22 本文已影响0人
Taoqi思
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>盒子</title>
<style type="text/css">
.box1{
width: 1100px;
height: 120px;
background-color: red;
margin-bottom: 10px;
margin: 0 auto;
*{
margin: 0;
padding: 0;
text-decoration: none;
}
.dang{
width: 230px;
height: 100px;
background-color: yellow;
float: left;
margin-top: 80px;
margin-left: 20px;
}
}
.box01{
width: 20px;
float:left;
margin-top: 80px;
margin-left: 20px;
}
.box02{
/*width: 200px;*/
/*height: 90px;*/
/*background-color: purple;*/
margin: 0 auto;
float: left;
margin-top: 80px;
margin-left: 20px;
}
.box03{
margin: 0 auto;
float: left;
margin-top: 80px;
margin-left: 20px;
}
.box04{
margin: 0 auto;
float: left;
margin-top: 80px;
margin-left: 20px;
}
.box05{
margin: 0 auto;
float: left;
margin-top: 80px;
margin-left: 20px;
}
.box06{
margin: 0 auto;
float: left;
margin-top: 80px;
margin-left: 20px;
}
.box07{
margin: 0 auto;
float: left;
margin-top: 80px;
margin-left: 20px;
}
.box08{
margin: 0 auto;
float: left;
margin-top: 80px;
margin-left: 20px;
}
.box09{
margin: 0 auto;
float: left;
margin-top: 80px;
margin-left: 20px;
}
.box10{
margin: 0 auto;
float: left;
margin-top: 80px;
margin-left: 20px;
}
.box11{
margin: 0 auto;
float: left;
margin-top: 80px;
margin-left: 20px;
}
.box12{
margin: 0 auto;
float: left;
margin-top: 80px;
margin-left: 20px;
}
.box2{
width: 1500px;
height: 120px;
background-color: blue;
}
.box3{
width: 6000px;
height: 700px;
background-color: gold;
}
</style>
</head>
<body>
<div class="box1">
<div class="dang"></div>
<div class="box01"><a href="全部商品"></a></div>
<div class="box02"></div>
<div class="box03"></div>
<div class="box04"></div>
<div class="box05"></div>
<div class="box06"></div>
<div class="box07"></div>
<div class="box08"></div>
<div class="box09"></div>
<div class="box10"></div>
<div class="box11"></div>
<div class="box12"></div>
</div>
<div class="box2"></div>
<div class="box3"></div>
</body>
</html>
