这篇博客展示了基础的网页布局和样式设计，包括顶部导航条、广告横幅、内容区域的盒子模型以及页脚的设计。使用了CSS进行无序列表的样式设置，如浮动元素、宽度、高度和边距，创建了一个典型的网页结构。
<style>
*{
margin : 0;
padding : 0;
}
li {
list-style: none;
}
.top {
height : 50px;
background-color : gray ;
}
.banner {
width : 980px;
height : 150px;
background-color : gray;
margin : 10px auto;
}
.box {
width : 980px;
margin : 0 auto;
height : 300px;
background-color : pink;
}
.box li {
float : left;
width : 237px;
height : 300px;
background-color : gray;
margin-right: 10px;
}
.box .last {
margin-right : 0;
}
.footer {
height : 200px;
background-color : gray;
margin-top: 10px;
}
</style>
<body>
<div class="top">top</div>
<div class="banner">banner</div>
<div class="box">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li class = "last">4</li>
</ul>
</div>
<div class="footer">footer</div>
</body>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
