读书人

绝对定位元素的正中实现

发布时间: 2013-11-29 13:49:33 作者: rapoo

绝对定位元素的居中实现

.element {    width: 600px; height: 400px;    position: aboslute; left: 0; top: 0; right: 0; bottom: 0;    margin: auto;    /* 有了这个就自动居中了 */}

代码两个关键点:

    上下左右均0位置定位;margin: auto

于是,就居中了。上面代码的width: 600px?height: 400px仅是示意,你修改为其他尺寸,或者不设置尺寸(需要是图片这种自身包含尺寸的元素),都是居中显示的。很有意思的~~

?

对了,该方法IE8+以及其他浏览器都是OK的。

读书人网 >Web前端

热点推荐