通过设置display样式为table-cell。
1、定义div的css
<style>div{
display:table-cell
}
</style>
2、定义水平div
<body><div>1</div><div>2</div><div>3</div>
</body>
补充：
display:table-cell属性指让标签元素以表格单元格的形式呈现，类似于td标签。目前IE8+以及其他现代浏览器都是支持此属性。
因为“text-align:center”控制的是文本居中，div居中可以用外边距margin来实现。
1、新建html文件，在body标签中添加div标签，div标签中的内容为“演示文本”，添加题目中的css样式，为了方便演示，给div标签添加灰色背景，这时可以发现div靠近浏览器的左侧，文字在div中居中：
2、为div标签添加新的外边距“margin”属性，属性值为“0 auto”，“0”指的是上下外边距为0，“auto”指的是左右外边距为自适应：
3、这时无论浏览器的宽度是多少，div都会在浏览器上水平居中：
这是div布局当中比较常用到的，不是很复杂代码如下：
样式部分：
<style>
*{ padding:0 margin:0}
.main{ width:500px text-align:center}
.head{ height:50px background-color:#0F0 margin-bottom:10px}
.left{ width:245px float:left height:250px background-color:#00F}
.right{ width:245px float:right}
.right li{ background-color:#FF0 width:76px float:left height:120px list-style:none margin-left:5px margin-bottom:10px}
</style>
框架部分：
<div class="main">
<div class="head">head</div>
<div class="left">left</div>
<ul class="right">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
</ul>
</div>
如图：
自己再亲手试下，希望对你有帮助！
