标签:css盒子模型的应用
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>盒子模型的应用</title> <link href="index.css" type="text/css" rel="stylesheet"> </head> <body> <div class="top"> <div class="top_content"></div> </div> <div class="body"> <div class="body_img"></div> <div class="body_content"> <div class="body_no"></div> </div> </div> <div class="footing"> <div class="footing_content"></div> <div class="footing_subSav"></div> </div> </body> </html>
*{
margin: 0px;
padding: 0px;
}
.top{
width: 100%;
height: 50px;
background-color: black;
}
.top_content{
width: 75%;
height: 50px;
margin: 0px auto;
background-color: blue;
}
.body{
margin: 20px auto;
width: 75%;
height: 1500px;
background-color: blanchedalmond;
}
.body_img{
width:100%;
height: 400px;
background-color: darkorange;
}
.body_content{
width: 100%;
height: 1100px;
background-color: blueviolet;
}
.body_no{
width: 100%;
height: 50px;
background-color: aqua;
}
.footing{
width: 75%;
height: 400px;
background-color: indigo;
margin: 0px auto;
}
.footing_content{
width: 100%;
height: 300px;
background-color: darkseagreen;
}
.footing_subSav{
width: 100%;
height: 100px;
background-color: black;
}标签:css盒子模型的应用
原文地址:http://11317783.blog.51cto.com/11307783/1772826