网页制作div+css
时间: 2023-10-25 19:10:13 浏览: 81
网页制作(div+css)
网页制作中使用div+css的方式可以实现更加灵活的布局和样式控制。以下是一个简单的示例:
HTML代码:
```
<div class="container">
<div class="header">Header</div>
<div class="content">Content</div>
<div class="footer">Footer</div>
</div>
```
CSS代码:
```
.container {
width: 80%;
margin: 0 auto;
}
.header {
background-color: #333;
color: #fff;
height: 50px;
line-height: 50px;
text-align: center;
}
.content {
background-color: #f5f5f5;
padding: 20px;
}
.footer {
background-color: #333;
color: #fff;
height: 50px;
line-height: 50px;
text-align: center;
}
```
以上代码实现了一个简单的网页布局,其中.container是一个容器,header、content、footer是三个子元素。使用CSS样式控制实现了header和footer固定在页面顶部和底部,content自适应内容高度。这种方式可以实现更加灵活的布局和样式控制。
阅读全文