本方法也兼容固定宽度的
HTML代码如下:
<div id="box">
<div id="container"></div>
</div>
CSS样式如下:
#box{
position: relative;
}
#container{
position: absolute;
width:30%;
height:100px;
background: #ccc;
left: 0;
right: 0;
margin:100px auto;
}
效果如图:
需要水平居中元素的父元素需相对定位,本身则绝对定位,并给出
left: 0;
right: 0;
margin:100px auto;
其中 margin:100px auto 也可以只写
margin-left:auto;
margin-right:auto;
————转载本文请注明出处