margin的值可以是auto auto表示“自动”的意思,当左外边距与右外边距的值都是auto时,那么这个盒子就会水平居中
注意:
●使用margin来实现水平居中时一定要有固定的宽度(给这个盒子设置一个宽度)只有块元素可以实现水平居中,行内元素是不能实现居中的
●只有标准文档流中的盒子才可以使用margin来实现水平居中
●margin属性是用来实现盒子的水平居中而不是文本的水平居中
●text-align这个属性它是用于实现文本的对齐方式,如果其值为center就表示文本水平居中但是它不能实现盒子的水平居中,
<div class="box"></div> <p>心系祖国,志存高远</p> <style type="text/css"> .box{ width: 100px;/*如果该元素没有设置固定的宽度那么这个元素就会占据其父元素的100%的宽度*/ height: 100px; background-color: #f00; margin: 100px auto;/*使用简写属性*/ } p{ height: 50px; line-height: 50px; text-align: center; background-color: #0f0; } </style>