warum Kastenhöhe größer ist als line-height
* {
margin: 0;
padding: 0;
}
div {
line-height: 30px;
}
a {
font-size: 12px;
}<div>
<a href="">测试</a>
</div>Ich glaube, die Inhaltshöhe die gleiche wie line-height ist die 30px ist. Aber in Chrome ist es 32px. Warum das?
Da <a /> eine eigene Zeilenhöhe hat, die über 1,0 liegt.
Fügen Sie diese Zeile in CSS:
a {
/* current styles */
line-height: 1;
}
Es ist in Ordnung. Aber ich traf ein anderes Problem, es scheint, der Raum oben das Wort ist größer als der Raum niedriger das Wort? Warum ? – a86356
Es hängt möglicherweise davon ab, wie Schriftart entworfen wird oder Browser-Rendering. Es macht mich manchmal auch krank, aber keine große Sache für mich :) –
können Sie vertical-align: middle; check in meiner Antwort ein –
Da die line-height in font-size prüfen hängt diese jsfiddle Ich habe gerade die font-size und die Höhe 30px
auch benötigen Sie vertical-align: middle; Für die <a> ist also der Raum von oben und unten zu sein gleich
Bitte wählen Sie eine richtige Antwort, wenn eine der Antworten Ihnen geholfen hat, dieses Problem zu beheben, so dass die anderen nicht haben, warum Sie weiter versuchen auf dieser –