第一种：已知元素宽、高
兼容：IE6+
源码：
css使元素垂直居中
Box">
demo：
第二种：元素宽、高未知
兼容：IE8+
源码：
css使元素垂直居中
Box">
要兼容IE6/7，需增加一个div，这个方法比较巧妙，利用了left、top的百分比值是相对于父元素的宽度这点特性
css使元素垂直居中
Box">
demo：
第三种：已知元素宽、高，需要借助一个div将上面的空间撑开
兼容：IE6+
源码：
css使元素垂直居中
Box">
demo：
第四种：元素宽、高未知，需要借助另一个元素的高度来实现居中，利用了vertical-align:middle的特性。
兼容：IE6+
源码：
css使元素垂直居中
Box">
demo：
第五种：元素宽、高未知，设置父元素相对定位，该元素绝对定位，margin: auto;且距离四个方向的距离都为0；如果要居中的元素未设置宽高，这种方法会使该元素铺满它的父元素。
兼容：IE8+
源码：
css使元素垂直居中
Box">
demo：
兼容：IE9+
源码：
css使元素垂直居中
Box">
demo：
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
