CSS margin auto属性值设置元素水平居中
margin的auto属性值
CSS中的margin属性可以用于设置HTML元素的外边距，属性值可以是像素、百分比、继承自父类，也可以是auto，让浏览器自动设置。通常情况下，将HTML元素的margin设置为auto并不能让该元素相对于父元素水平居中，那该怎么办呢？方法如下：
需要额外设置该元素的宽度，即设置width属性即可。
margin auto设置元素水平居中实例，及在线编辑器
<div class='e1'>
<p class='e2'>内容一</p>
<p class='e3'>内容二</p>
</div>
<style>
.e1{width:100%;height:50px;border:1px solid skyblue;}
.e2{margin:auto;width:20%;height:30px;}
.e3{margin:auto;}
</style>实例代码解析
如上代码在线运行之后，内容一可以水平居中，而内容二则不行。内容一的p元素和内容二的p元素都将margin属性值设置为auto，最大的不同点是内容一的元素设置了width和height属性，如果删除掉height属性，内容一同样可以水平居中。