Heim >Web-Frontend >CSS-Tutorial >Ausführliche Einführung zur Zeilenhöhe
1. Die Definition der Zeilenhöhe bezieht sich auf den Abstand zwischen den Zeilen, also auf den Abstand zwischen den Grundlinien. Warum gibt es also immer noch eine Zeile? Höhe? Mit dieser Frage im Hinterkopf blicken wir nach unten. 2. Inline-Box-Modell
Dies ist eine einzelne Textzeile und es gibt einen Inhaltsbereich
Abbildung 1 Der „Inhaltsbereich“ ist ein Feld, das den Text umgibt. Wir können uns die Größe des mit der Maus ausgewählten Textbereichs vorstellen wie in Abbildung 1 Der Bereich, in dem der Text mit der Maus ausgewählt wird, ist der Bereich, in dem „eine einzelne Textzeile“ ausgewählt ist. „Inline-Boxen“ zeigen Text nicht in Blöcken, sondern in einer Zeile an. Von Inline-Elementen umschlossener Text, beispielsweise der von Span-Tags umschlossene „Inhaltsbereich“, kann als „Inline-Box“ bezeichnet werden, während der Teil, der nicht von Inline-Elementen umschlossen ist, als „anonyme Inline-Box“ betrachtet werden kann. Die „Inline-Box“ kann als „Inhaltsbereich“-Bereich innerhalb des Span-Tags in Abbildung 1 gesehen werden, und die „anonyme Inline-Box“ kann als die rote virtuelle Box1 Muss das CSS-Attribut --lineheight beherrschen
Einführung: 1. Definition der Zeilenhöhe Die Zeilenhöhe bezieht sich zum Abstand zwischen Zeilen Abstand, also dem Abstand zwischen Grundlinien, und nur zwei Textzeilen haben zwei Grundlinien, warum hat also eine einzelne Textzeile immer noch eine Zeilenhöhe? Mit dieser Frage im Hinterkopf blicken wir nach unten. 2. Inline-Box-Modell Dies ist eine einzelne Textzeile und es gibt eine Beschriftung des Inhaltsbereichs. Der „Inhaltsbereich“ ist der Rahmen, der den Text umgibt. Wir können ihn uns als die Größe des mit der Maus ausgewählten Textbereichs vorstellen Abbildung 1 wird mit der Maus ausgewählt.
2.Teilen Sie eine Methode, um die Schriftgröße im Vorwort größer und unzentrierter zu machen.
Einführung: Szenario: Klicken Sie auf einen Buchstaben, um ein Modal zu öffnen und den Buchstaben im Modal anzuzeigen. Stil: .modal{ Position: links: 0; unten: 0; Rand: 140rpx; Linienhöhe:...
[Verwandte Q&A-Empfehlungen]:
Javascript – Ein seltsames Problem bei der Berechnung von DOM-Attributen (getComputedStyle)
Das obige ist der detaillierte Inhalt vonAusführliche Einführung zur Zeilenhöhe. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!