元素水平居中和垂直居中的几种简单方法

1、如何使元素在水平方向上居中

1. 使用text-align:center。

    在父级元素的CSS样式设置text-align:center。把内部嵌套一个div把它看成文原本对待，不过这个方法有时候是无论用的。

2.在须要居中的元素设置margin：0 auto。

    这句CSS的意思为：设置margin-left和margin-right为自动适应父级元素宽度。因此能够使元素水平居中，不过记得设置其width。

2、如何使元素在垂直方向上居中

1.使图片在垂直方向上居中。

    div{backgroud-position:0 50%} 。固然，这只适用于背景图！

2.使只含文本的元素居中。

    在css里设置它的行高：line-height：xx px。 xx为其自己height值。

3.使包含文本和其余元素都同时居中。

    仅仅设置行高是不够的，应该再加上display:table-cell;vertical-align:middle.这样就能够使其垂直居中。

我以上提到的都是经常使用的方法，不全面，也没深刻讲。还有用CSS expression方法实现水平居中的等等方法。