Heim >Web-Frontend >CSS-Tutorial >Der Unterschied zwischen Höhe und Zeilenhöhe in CSS

Der Unterschied zwischen Höhe und Zeilenhöhe in CSS

巴扎黑
巴扎黑Original
2017-06-28 09:59:272587Durchsuche

Dieser Artikel stellt hauptsächlich den Unterschied zwischen Höhe und Linienhöhe in CSS vor. Freunde in Not können sich darauf beziehen. Zeilenhöhe: Zeilenhöhe legt den oberen und unteren Abstand zwischen Text fest.
Höhe: Höhe definiert die Höhe einer Ebene oder etwas Ähnlichem.

Mit anderen Worten: Zeilenhöhe bezieht sich speziell auf die Höhe einer Ebene Einzelzeile und Höhe können alle sein Die Höhe des Elements

Überlappen sich die Kanten, nachdem der Text vergrößert wurde?

Unter „Zeilenhöhe“ versteht man direkt die Höhe des Textes zuzüglich des Leerraums über und unter dem Text. Es ist am besten, die Einheit für „Zeilenhöhe“ nicht festzulegen , die Zeilenhöhe ist der ermittelte Wert.

Wenn die Schriftart vergrößert ist und die Zeilenhöhe des Elements nicht festgelegt ist ( erbt vom übergeordneten Element und das übergeordnete Element einen festen Wert hat) oder sein Wert ein fester Wert ist , wird der Text über den Zeilenhöhenbereich hinaus angezeigt.

Zeilenhöhe hat geerbte Attribute, daher ist es am besten, die Zeilenhöhe des Haupttextes auf die Zahl 1,5 zu setzen, was der Höhe der Schrifthöhe * 1,5 entspricht Auf diese Weise folgt die Zeilenhöhe der Schriftart. Zoom folgt Zoom.


Wie stelle ich ein, dass Text und Bild innerhalb der Zeile zentriert werden?

Zeilenhöhe ist standardmäßig an der Grundlinie ausgerichtet. Sie können
vertikal-align
:middle verwenden, um den Text und das Bild zentriert auszurichten.
Wie kann man die Lesbarkeit verbessern?

Inline-Texthintergrundfarbe #fff, Textfarbe #333; es gibt eine Leerzeilenhöhe um den Text von 1,25-1,5, um das Gefühl der Unterdrückung zu verringern der andere kann 12 Pixel groß sein.
Eingabeschaltfläche verhält sich in allen Browsern gleich.

Der Standardwert für die Linde-Höhe von Firefox ist standardmäßig normal und muss explizit angegeben werden.

Der Code lautet wie folgt:

button, input[type="button"], input[type="submit"] {

line-height:normal !important

}
input.button, a.button, button {
Schriftart: fett 12px Arial, Helvetica, serifenlos;

Padding
: 5px 8px; >Überlauf:visible; }

Das obige ist der detaillierte Inhalt vonDer Unterschied zwischen Höhe und Zeilenhöhe in CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn