利用css+div 做一个简单居中结构

css：

#a1{ width:400px;height:200px; margin:0 auto;}
.b{float:left;width:200px;height:200px;background-color:#666666;}
.b1{float:left;width:200px;height:200px;background-color:#666666;}

html：

<div id="a1">
<div class="b">第一个</div>
<div class="b1">第二个</div>
</div>

 

代码很简单。说明：float用来实现2个元素并排排列；margin用来实现简单的居中排列。

id=a1 的div其实启动完全融合b b1元素的容器，为什么这样做，是因为margin 和float 互斥性。

其结果：