首页 > 代码库 > Html第二天
Html第二天
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>网页标题</title>
<style>
body{
margin:0;
}
.uni{
float: left;
}
</style>
</head>
<body>
<div style="width:100%;height: 32.8px;background: grey;margin:0 auto;"></div>
<div style="width:1190px;height: 60px;background: orange;margin: auto;"></div>
<div style="width:1190px;height:107px;background: yellow;margin: 0 auto;margin-top:10px;"></div>
<div style="width:1190px;height: 540px;margin:0 auto;">
<div style="width: 205px;height: 540px;background: blue;" class="uni"></div>
<div style="width: 985px;height: 43px;background: silver;" class="uni"></div>
<div style="width: 450px;height: 497px;background: gold;margin-left: 7px;" class="uni"></div>
<div style="width: 220px;height: 497px;" class="uni">
<div style="width: 220px;height: 165px;background: red;"></div>
<div style="width: 220px;height: 165px;background:yellow;"></div>
<div style="width: 220px;height: 165px;background: red;"></div>
</div>
<div style="width: 300px;height: 497px;margin-left: 7px;" class="uni">
<div style="width: 300px;height: 124.6px;background: blue;"></div>
<div style="width: 300px;height: 195.8px;background:red;"></div>
<div style="width: 300px;height: 165px;background: green;margin-top: 10px;"></div>
</div>
</div>
<div style="width: 1190px;height: 100px;background: pink;margin:0 auto;margin-top: 10px;"></div>
<div style="width: 1190px;height: 200px;margin:0 auto;">
<div style="width: 170px;height: 200px;background: red;" class="uni"></div>
<div style="width: 333px;height: 198px;background:yellow;margin-left: 21px;" class="uni"></div>
<div style="width: 333px;height: 198px;background: red;" class="uni"></div>
<div style="width: 333px;height: 198px;background:yellow;" class="uni"></div>
</div>
<div style="width: 1190px;height: 200px;margin:0 auto;">
<div style="width: 170px;height: 200px;background: blue;" class="uni"></div>
<div style="width: 168px;height: 200px;margin-left: 12px;" class="uni">
<div style="width: 168px;height: 98px;background: yellow;"></div>
<div style="width: 168px;height: 98px;background: pink;"></div>
</div>
<div style="width: 168px;height: 200px;" class="uni">
<div style="width: 168px;height: 98px;background: pink;"></div>
<div style="width: 168px;height: 98px;background: yellow;"></div>
</div>
<div style="width: 168px;height: 200px;" class="uni">
<div style="width: 168px;height: 98px;background: yellow;"></div>
<div style="width: 168px;height: 98px;background: pink;"></div>
</div>
<div style="width: 168px;height: 200px;" class="uni">
<div style="width: 168px;height: 98px;background: pink;"></div>
<div style="width: 168px;height: 98px;background: yellow;"></div>
</div>
<div style="width: 168px;height: 200px;" class="uni">
<div style="width: 168px;height: 98px;background: yellow;"></div>
<div style="width: 168px;height: 98px;background: pink;"></div>
</div>
<div style="width: 168px;height: 200px;" class="uni">
<div style="width: 168px;height: 98px;background: pink;"></div>
<div style="width: 168px;height: 98px;background: yellow;"></div>
</div>
<div style="width: 1190px;height: 305px;margin:0 auto;">
<div style="width: 588px;height: 90px;background: black;margin:0 auto;margin-top: 6px;" class="uni"></div>
<div style="width: 588px;height: 90px;background: black;margin-left: 14px;margin-top: 6px;" class="uni"></div>
</div>
<!-- 第一个 -->
<div style="width: 1190px;height: 305px;margin:0 auto;margin-top:6px;">
<div style="width: 585px;height: 305px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
<div style="width: 585px;height: 305px;margin-left: 20px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
</div>
<!-- 第二个 -->
<div style="width: 1190px;height: 305px;margin:0 auto;margin-top:6px;">
<div style="width: 585px;height: 305px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
<div style="width: 585px;height: 305px;margin-left: 20px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
</div>
<!-- 第三个 -->
<div style="width: 1190px;height: 305px;margin:0 auto;margin-top:6px;">
<div style="width: 585px;height: 305px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
<div style="width: 585px;height: 305px;margin-left: 20px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
</div>
<!-- 第四个 -->
<div style="width: 1190px;height: 305px;margin:0 auto;margin-top:6px;">
<div style="width: 585px;height: 305px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
<div style="width: 585px;height: 305px;margin-left: 20px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
</div>
<!-- 第五个 -->
<div style="width: 1190px;height: 305px;margin:0 auto;margin-top:6px;">
<div style="width: 585px;height: 305px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
<div style="width: 585px;height: 305px;margin-left: 20px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
</div>
<div style="width: 1190px;height: 305px;margin:0 auto;margin-top:6px;">
<div style="width: 585px;height: 305px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
<div style="width: 585px;height: 305px;margin-left: 20px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
</div>
<!-- 第二个 -->
<div style="width: 1190px;height: 305px;margin:0 auto;margin-top:6px;">
<div style="width: 585px;height: 305px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
<div style="width: 585px;height: 305px;margin-left: 20px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
</div>
<!-- 第三个 -->
<div style="width: 1190px;height: 305px;margin:0 auto;margin-top:6px;">
<div style="width: 585px;height: 305px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
<div style="width: 585px;height: 305px;margin-left: 20px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
</div>
<!-- 第四个 -->
<div style="width: 1190px;height: 305px;margin:0 auto;margin-top:6px;">
<div style="width: 585px;height: 305px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
<div style="width: 585px;height: 305px;margin-left: 20px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
</div>
<!-- 第五个 -->
<div style="width: 1190px;height: 305px;margin:0 auto;margin-top:6px;">
<div style="width: 585px;height: 305px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
<div style="width: 585px;height: 305px;margin-left: 20px;" class="uni">
<div style="width: 199px;height: 305px;background: grey;" class="uni"></div>
<div style="width: 252px;height: 305px;background: green;" class="uni"></div>
<div style="width: 134px;height: 305px;" class="uni">
<div style=" width: 134px;height: 152px;background: yellow;"></div>
<div style=" width: 134px;height: 152px;background: blue;"></div>
</div>
</div>
</div>
<div style="width: 1190px;height: 90px;background: purple;margin-top: 6px;"></div>
<div style="width: 1190px;height: 390px;margin-top: 10px;">
<div style="width: 1190px;height: 190px;">
<div style="width: 190px;height: 190px;background: yellow;" class="uni"></div>
<div style="width: 190px;height: 190px;background: red;margin-left: 10px;" class="uni"></div>
<div style="width: 190px;height: 190px;background: blue;margin-left: 10px;" class="uni"></div>
<div style="width: 190px;height: 190px;background: pink;margin-left: 10px;" class="uni"></div>
<div style="width: 190px;height: 190px;background: brown;margin-left: 10px;" class="uni"></div>
<div style="width: 190px;height: 190px;background: black;margin-left: 10px;" class="uni"></div>
</div>
<div style="width: 1190px;height: 190px;margin-top:10px;">
<div style="width: 190px;height: 190px;background: yellow;" class="uni"></div>
<div style="width: 190px;height: 190px;background: red;margin-left: 10px;" class="uni"></div>
<div style="width: 190px;height: 190px;background: blue;margin-left: 10px;" class="uni"></div>
<div style="width: 190px;height: 190px;background: pink;margin-left: 10px;" class="uni"></div>
<div style="width: 190px;height: 190px;background: brown;margin-left: 10px;" class="uni"></div>
<div style="width: 190px;height: 190px;background: black;margin-left: 10px;" class="uni"></div>
</div>
</div>
<div style="width: 1190px;height: 43px;background:purple;margin-top:10px;"></div>
</div>
</body>
</html>
效果图如下
本文出自 “12145919” 博客，请务必保留此出处http://12155919.blog.51cto.com/12145919/1861279
Html第二天