首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

绝对定位元素的正中实现

2013-11-29 
绝对定位元素的居中实现.element {width: 600px height: 400pxposition: aboslute left: 0 top: 0 ri

绝对定位元素的居中实现

.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的。

热点排行