学习DIV+CSS一个最简单的布局一行三列DIV代码!
CSS代码如下:
body{
text-align:center;
margin:0px;
padding:0px;
}
#father
{
position:relative;
width:750px;
text-align:center;
}
#banner{height:96px;background-color:#999;text-align:left; padding:0px;margin:0px;}
#b-left{width:159px;margin:0px;padding:0px;float:left;}
#b-center{margin:0px;float:left;}
#b-right{
text-align:left;
marign:0px;
padding:0px;
width:108px;
background-color:#00ffff;
height:96px;
float:right;
}
HTML代码如下:
<div id=banner>
<div id=b-left> <img src="images/51.gif" /> </div>
<div id=b-center><img src="images/tupian26.gif" /></div>
<div id=b-right>
<ul style="list-style-type:none;">
<br />
<li>设为首页</li>
<li>加入收藏</li>
<li>联系我们</li>
</ul>
</div>
</div>
现在总结一下:
一行三列的布局有以下几种 思想:
第一都做成绝对的布局,设定每一个块和周围的距离
第二就是利用嵌套的方法,把任意两个先当成一个,然后再把他们和第三个一起设!不过我这里好像直接把三个块都是分开设的,好像也没有问题!呵呵!