CSS+DIV基礎(chǔ)代碼
<!DOCTYPE html>
<html>
<head>
<title>CSS+DIV基礎(chǔ)代碼</title>
<style>
/* 定義CSS樣式 */
body, html {
margin: 0;
padding: 0;
}
#container {
width: 960px;
margin: 0 auto;
}
#header {
height: 100px;
background-color: #ccc;
}
#nav {
height: 50px;
background-color: #999;
}
#content {
width: 720px;
float: left;
background-color: #666;
}
#sidebar {
width: 240px;
float: right;
background-color: #333;
}
#footer {
clear: both;
height: 100px;
background-color: #ccc;
}
</style>
</head>
<body>
<div id="container">
<div id="header"></div>
<div id="nav"></div>
<div id="content"></div>
<div id="sidebar"></div>
<div id="footer"></div>
</div>
</body>
</html>以上是一個(gè)基礎(chǔ)的CSS+DIV布局代碼，通過CSS樣式來完成網(wǎng)頁的布局，HTML中使用div標(biāo)簽劃分出不同的區(qū)域。其中，利用float屬性實(shí)現(xiàn)了左右兩欄布局，清除浮動(dòng)使用了clear:both屬性。通過嵌套，也可以實(shí)現(xiàn)更復(fù)雜的布局。