文章目录
[+]
CSS中笔墨居中显示的办法有以下五种：
利用text-align属性设置文本的对齐办法将text-align属性值设置为center可以将文本居中显示。
.center { text-align: center;}利用vertical-align属性设置元素的垂直对齐办法
将vertical-align属性值设置为middle可以将文本垂直居中显示。
（图片来自网络侵删）
.center { vertical-align: middle;}利用line-height属性设置行高
将line-height属性值设置为比字体大小略大的值，可以使文本在容器中垂直居中显示。
.center { line-height: 20px;}利用display
display: flex属性将父元素设置为弹性布局，并利用align-items: center属性将子元素在交叉轴上居中对齐。
.center { display: flex; align-items: center;}利用position
position: absolute属性和transform: translateY(-50%)将子元素相对付其父元素垂直居中对齐。
// 父容器.center { position: relative; height: 200px;}// 子容器.center > div { position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); height: 100px; width: 200px; background-color: #ccc;}
以上便是CSS中笔墨居中显示的几种办法，根据实际需求选择得当的办法即可。
