如何使文字在div中水平和垂直居中的css代码，<div>水平垂直居中</div>

关键字：css 更新时间：2018-03-16 07:53:25 123次访问

使文字在div中水平和垂直居中的的css样式为

text-align:center; /*水平居中*/
line-height: 20px; /*行距设为与div高度一致*/

示例如下：

HTML元素

<div>水平垂直居中</div>

css样式

div{
width:200px;height:200px;  /*设置div的大小*/
border:1px solid green;    /*边框*/
text-align: center;        /*文字水平居中对齐*/
line-height: 200px;        /*设置文字行距等于div的高度*/
overflow:hidden;
}

显示效果

相关标签：css