水平居中

水平居中:

1:如果需要水平居中的元素为内联元素(inline),则只需要对他的父元素添加text-aligh:center。就可以实现水平居中。

2:如果需要水平居中的元素为常规流中的block元素。则:1)为元素设置高度。2)设置元素的margin:0 auto;

IE6以下需在父元素上设置text-align:center,再给子元素恢复需要的值。

3:如果需要居中的元素为浮动元素,则:1) 为元素设置宽度。2) position设置为relative 3) 浮动方向偏移量设置为50% 4) 浮动方向上的margin设置为元素宽度一半乘以-1;

4:如果需要居中的元素为绝对定位元素:有两种方法:

第一种是:

1)  为元素设置宽度

2)  偏移量设置为50%;

3)  偏移方向外边距设置为元素宽度一半乘以-1;

第二种方法是:

1)  为元素设置宽度

2)  设置左右偏移量都为0;

3)  设置左右外边距为auto;

posted on 2016-03-27 14:27  baiyuhong  阅读(203)  评论(0编辑  收藏  举报