CSS中垂直居中的元素

CSS中垂直居中的元素

最简单，最干净的方法是使用

display: table

并垂直对齐。但是，IIRC（自从我开始浏览器兼容性问题以来已经有一段时间了）

display:table

……也许某些普通版本的IE缺乏对朋友的支持。无论如何，如果

display: table

忽略则添加其他规则以进行适当的回退可能会很好。

<div id="container" >    <div id="div1" >        <img id="img1" src="image1.jpg" />    </div>    <div id="div2" >        <img id="img2" src="image2.jpg" />    </div></div>

（当然，样式应该在样式表中；这只是与您的原始示例匹配，而不知道用例。）

该

display

值

table

，

table-row

以及

table-cell

基本执行酷似HTML

table

，

tr

以及

td

，但你被允许省略任何人（如我在这里做的，采用

table-cell

直接在小号

table

S）和布局引擎会做合理的事情。