[HTML 布局 - 使用<div><css> 元素]
![]() | 左边布局采用<div>直接布局 <css>直接布局 下方代码只是提供参考 |
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>爱分享资源网基础教程</title>
<style type="text/css">
.top{background-color:#090; font-family:黑体; font-size:30px; width:250px; height:30px; color:#FFF; text-align:center;}
.left{font-size:16px; color:#FFF; width:250px; height:200px;}
li{background:#03C; height:20px; width:250px; text-align:center;}
</style>
</head>
<body>
<div class="top" align="center">爱分享资源网</div>
<div class="left" style="background:#000" align="left">
<div style="background:#999; width:50px; height:50px;"></div>
<div style="background:#00C; width:100px; height:50px;"></div>
<div style="background:#360; width:80px;height:50px;"></div>
<div style="background:#CCC; width:100%;height:10px;"></div>
<div style="background:#360; width:130px;height:30px;"></div>
<div style="background:#999; width:20px; height:10px;"></div>
</div>
<li>我是底部</li>
</body>
</html>
QQ群:513185891