<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>DIV+CSS实现两行散列布局</title>
<style type="text/css">
body{
margin:0;
padding:0;
font-size:1em;
}
#header{
width:1002px;
height:100px;
margin:0 auto;
background:#06f;
}
#divall{
width:1002px;
margin:0 auto;
background:#fff;
}
#footer{
width:1002px;
height:60px;
margin:0 auto;
background:#999;
}
#sider_a{
width:220px;
float:left;
background:#f93;
}
#main{
width:580px;
float:left;
margin-left:6px;
background:#dceafc;
}
#sider_b{
width:190px;
float:right;
background:#ccc;
}
</style>
</head>
<body>
<div id="header">header</div>
<div id="divall">
<div id="sider_a">sider_a</div>
<div id="main">main </div>
<div id="sider_b">sider_b</div>
</div>
<div id="footer">footer</div>
</body>
</html>
已经有(1)位网友发表了评论,你也评一评吧!
原创文章如转载,请注明:转载自Eddy Blog
原文地址:http://www.rrgod.com/webdesign/53.html 欢迎订阅Eddy Blog。
可在此地址进行在线效果测试:
http://www.w3school.com.cn/tiy/t.asp?f=html_areamap