在网页布局中元素水平居中比元素垂直居中要简单不少，同时实现水平居中和垂直居中往往是最难的。现在是响应式设计的时代，我们很难确切的知道元素的准确高度和宽度，所以一些方案不大适用。
在css中水平和垂直居中的代码如下：
可以用“text-align”属性和“line-height”属性。
1、新建html文件，在body标签中添加div标签，在div标签输入文字，这里以“演示文本”为例，给div标签设置宽度、高度和背景色属性，属性值分别为200、100和灰色，这时“演示文本”默认位置为div盒子的左上方： 2、这时给div标签添加上“text-align”属性，属性值为“center”，这时文字将会在div容器中水平居中： 3、这时给div标签添加行高“ling-height”属性，属性值为高度的值“100px”，再添加“vertical-align”属性，属性值为“middle”，这时文字将会水平垂直都居中。
