利用DIV+CSS对页面布局

Eddy 发布于2009-11-2 14:25:36 分类: 网站相关 已浏览loading 网友评论1条 我要评论

<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

关于 DIV  CSS  布局  的相关文章

  1. 发表于2009-11-2 15:12:07

    可在此地址进行在线效果测试:

    http://www.w3school.com.cn/tiy/t.asp?f=html_areamap

记住我的信息,下次不用再输入 欢迎给Eddy Blog留言