HTML中文本的行高line-height能撑开盒子,但是不能撑开a 标签。
如代码所示,没有给div 盒子高,但是给<a>了一个行高 line-height为100px.
<div style="background-color: pink;">
<a href="#" style="line-height: 100px;">alkjlkjg</a>
</div>
运行结果如下:
我们可以看到,盒子已经被a的行高撑开,但是只有将鼠标放到“字上”鼠标才会变成小手,而放到字的上下两侧则不会变成小手。疑问就在这里,字的上下两侧也是a的行高所撑开的啊,为什么鼠标却不能变成链接小手?
将a 加display:block; 则a 上下两侧即被行高撑开,鼠标放到字的上下两侧行高范围内也可变成小手了。
可能的原因:行高只是a里面字的行高,而不是a变宽了? 欢迎解答