您的位置:首页 > Web前端 > CSS

CSS字体水平 垂直居中

2019-06-01 13:40 801 查看
.showMsg{
width: 300px;
height: 50px;
border: 1px solid;

/* 文字居中 */
text-align: center;

/* 字体垂直居中 */
display: table-cell;
vertical-align: middle;
}

看样式中 display: table-cell ,作为表格单元格显示,如此一来, vertical-align:middle 属性起作用了。去掉display可就不行。
也可以使用如下样式:

line-height: 50px;

只要确保联合height的px相等,即可实现垂直居中效果。

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: