以
#next-button{
height: 54px;
text-align: center;
color: #fff;
background: #e2231a;
line-height: 54px;
font:16px "Microsoft YaHei","Hiragino Sans GB";
cursor: pointer;
margin: 0 auto;
width:400px;
}
下一步
在其中,我们设置了宽度、高度、背景颜色、字体以及水平与垂直居中,然而,我们却得到了这样的效果:
#next-button{
width:400px;
height: 54px;
text-align: center;
color: #fff;
background: #e2231a;
font:16px/54px "Microsoft YaHei","Hiragino Sans GB";
cursor: pointer;
margin: 0 auto;
}
下一步
的时候,就可以垂直居中。原因就在于如果风格声明列表中有line-height与font,则line-height无效,必须与font一起使用。只要风格声明中没有font,就可使用line-height来设置文本的垂直居中了。到此这篇关于详解HTML中字体使用line-height依然不能垂直居中解决办法的文章就简介到这了