Heim >Web-Frontend >CSS-Tutorial >CSS-Artikel – Methode zur Berechnung der Zeilenhöhe (übergeordnete und untergeordnete Elemente)
CSS-Artikel – Methode zur Berechnung der Zeilenhöhe (übergeordnete und untergeordnete Elemente)
- 高洛峰Original
- 2017-02-13 14:14:552354Durchsuche
Hier sind nur einige Situationen, die meiner Meinung nach anfällig für Unklarheiten sind. Die
HTML-Struktur lautet wie folgt:
<p> </p><p> 测试行高 </p>
Das übergeordnete Element ist eine Zahl und das untergeordnete Element ist nicht festgelegt
.parent{
font-size: 12px;
ine-height: 1;
}
.child{
font-size: 16px;
}
Das übergeordnete Element ist 
Das untergeordnete Element ist 
Gibt an, dass das untergeordnete Element den numerischen Wert der Anzeigeeinstellung des übergeordneten Elements erbt, der sich auf die eigene Schriftgröße des übergeordneten Elements bezieht
Prozentsatz des übergeordneten Elements , das untergeordnete Element ist nicht festgelegt
.parent{
font-size: 12px;
line-height: 100%;
}
.child{
font-size: 16px;
}
übergeordnetes Element Das übergeordnete Element ist 
Das untergeordnete Element ist 
, was darauf hinweist, dass das untergeordnete Element die Zeilenhöhe des übergeordneten Elements erbt Das Element wird auf der Grundlage des Prozentsatzes berechnet und hat nichts mit der Schriftgröße des übergeordneten Elements selbst zu tun.
bezogen auf
Für die Fälle 1 und 2 fügen Sie line-height: inherit zum untergeordneten Element hinzu , und leiten Sie die Fälle 3 und 4 mit der gleichen Leistung ab
Hier sind nur einige wenige Personen aufgeführt. Situationen, die leicht verwischt werden können. Die
HTML-Struktur lautet wie folgt:
<p> </p><p> 测试行高 </p>
Das übergeordnete Element ist eine Zahl und das untergeordnete Element ist nicht festgelegt
.parent{
font-size: 12px;
ine-height: 1;
}
.child{
font-size: 16px;
}
Das übergeordnete Element ist
Das untergeordnete Element ist
Gibt an, dass das untergeordnete Element den numerischen Wert der Anzeigeeinstellung des übergeordneten Elements erbt, der sich auf die eigene Schriftgröße des übergeordneten Elements bezieht
Prozentsatz des übergeordneten Elements , das untergeordnete Element ist nicht festgelegt
.parent{
font-size: 12px;
line-height: 100%;
}
.child{
font-size: 16px;
}
Elternelement Wenn das übergeordnete Element
ist, ist das untergeordnete Element
, was darauf hinweist, dass das untergeordnete Element die Zeilenhöhe von erbt Das übergeordnete Element wird anhand des Prozentsatzes berechnet und hat nichts mit der Schriftgröße des übergeordneten Elements selbst zu tun
Mehr CSS-Artikel zur Berechnung der Artikelzeilenhöhe (übergeordnete und untergeordnete Elemente) verwandte Artikel bitte beachten zur chinesischen PHP-Website!