inline-block和line-height的问题

来源：

qq_Moriarty_1

2016-06-27

在课程中多次出现display:inline-block和line-height组合的例子：

.trans-report a {
display: inline-block;
padding: 1rem;
line-height: 3rem;
color: #fff;
}

我发现如果没有display：inline-block，那么line-height这句就不起作用，这是为什么呢？

如果单独新建一个HTML文件，在div中a标签直接设置line-height是可以上下居中的，怎么在课程中的代码，就需要两者的配合？

写回答

1回答

liufanfrank

2016-06-27

已采纳

a标签是行内元素,行内元素是没有高度的,当行内元素需要高度时就必须块元素或者行内块元素,才能撑起行高line-height

你说的情况有时候行高可以撑起高度,但是会影响盒子模型,在稍微复杂的情况下非常容易出错,所以要使用line-height必须要给inline-block

qq_Moriarty_1

非常感谢！

2016-06-27

共1条回复

响应式开发一招致胜

用一套代码开发出不受设备型号、尺寸限制的互联网金融网站

4021 学习 · 752 问题

相似问题

回答 1

回答 1

回答 1

回答 1

回答 1