CSS居中方法

1.水平居中

①text-align:center ，针对父元素进行设置，子元素没有被float影响

②margin:0 auto，针对对子元素进行设置，子元素没有被float影响

 

2.垂直居中

line-height，针对父元素设置，当它的值等于父元素的height值时，内部的文字就会自动的垂直居中了。

 

3.万能的position大法

无论什么形式都可以居中，缺点是必须对元素有确定的宽高值，否则需通过javascript来进行计算。

①给父元素写上positon:relative，子元素position:absolute

②子元素设定height和width

③子元素设置top:50%;margin-top:一半的height值的的负数;可实现垂直居中。

  子元素设置left:50%;margin- left:一半的weight值的负数;可实现垂直居中。