在这种情况下，精确线宽如何工作

问题描述

在此问题中，，并给出相同的代码，我在此重复此处：

In this question positioning text of anchor within a div and given the same code which I repeat here:

HTML标记

<div id="header">
    <a href="cattle.html" class="current">Cattle Farms</a>
</div>

CSS样式

#header a {
    width: 100%;
    height: 100%;
    display: block;
    font-size: 25px;
}

回答

div#header a {
    width: 100%;
    height: 100%;
    display: block;
    text-indent: 20px;
    line-height: 350px;
}

我的问题是为什么不是line-height让a突破div

My question is why does not the line-height make the a break out of the div

推荐答案

它打破了div。如果你在 a 标签中放置一个 span ，并给出一个inline-block所以你可以看到它）你会意识到。记住，span继承了line-height。查看：

It does break out of the div. If you put a span inside the a tag and give it a display of inline-block (and a background-color so you can see it) you'll realize it does. Remember the span inherits the line-height. Take a look:

给予 a 更大的行高，也能够意识到它正在打破这个鸿沟：

Give the a a bigger line-height and without anything else you'll also be able to realize it is breaking out of the div: http://jsfiddle.net/fnX9n/7/

这篇关于在这种情况下，精确线宽如何工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！