Heim > Web-Frontend > CSS-Tutorial > Hauptteil

So legen Sie die Zeilenhöhe in CSS fest

下次还敢
Freigeben: 2024-04-28 15:03:13
Original
460 Leute haben es durchsucht

Die Zeilenhöheneinstellung in CSS wird verwendet, um die Höhe zwischen Textzeilen im Element festzulegen, die über das Attribut „line-height“ festgelegt wird. Die Einstellungsmethoden sind: Wert: feste Höhe (Pixel- oder Einheitenwert) Prozentsatz: basierend auf dem Prozentsatz der Schriftgröße des übergeordneten Elements Einheitenloser Wert: Legen Sie den Standardwert fest (normal) oder erben Sie die Zeilenhöhe des übergeordneten Elements (erben)

So legen Sie die Zeilenhöhe in CSS fest

CSS-Einstellung für mittlere Zeilenhöhe

In CSS wird die Zeilenhöhe verwendet, um die Höhe zwischen Zeilen chinesischen Texts in einem Element festzulegen. Sie kann über das Attribut line-height festgelegt werden. line-height属性进行设置。

设置方式:

line-height: 值;

值类型:

  • 数值:以像素(px)或单位值(em、rem等)表示的固定高度。例如:line-height: 20px;
  • 百分比:基于父元素字体大小的百分比。例如:line-height: 150%;
  • Einstellungsmethode:

    line-height: value;

    • Werttyp:
    • Wert: In Pixel (px) oder Einheitenwerten (em, rem usw.) stellt eine feste Höhe dar. Zum Beispiel: line-height: 20px;
  • Prozentsatz:
Prozent basierend auf der Schriftgröße des übergeordneten Elements. Zum Beispiel: line-height: 150%;

Wert ohne Einheit:

Einige spezielle Werte ohne Einheit, wie zum Beispiel:

    normal:
  • Als Standardwert des Browsers festlegen.
  • inherit:
  • Erbt die Zeilenhöhe vom übergeordneten Element.
🎜🎜Beispiel: 🎜🎜
<code class="css">/* 将段落中的行高设置为 1.5 倍的字体大小 */
p {
  line-height: 1.5em;
}

/* 将标题中的行高设置为 20 像素 */
h1 {
  line-height: 20px;
}</code>
Nach dem Login kopieren
🎜🎜Hinweis: 🎜🎜🎜🎜Die Einstellung der Zeilenhöhe ist 🎜relativ zur Schriftgröße🎜. Wenn Sie also Prozentsätze oder einheitenlose Werte verwenden, wird sie automatisch basierend auf der Schriftgröße angepasst. 🎜🎜Wenn die Zeilenhöhe nicht angegeben ist, verwendet der Browser den Standardwert, der normalerweise etwa das 1,2-fache der Schriftgröße beträgt. 🎜🎜Die Zeilenhöhe beeinflusst nicht nur das Erscheinungsbild von Text, sondern auch die vertikale Ausrichtung von Elementen und den Abstand zwischen Elementen. 🎜🎜

Das obige ist der detaillierte Inhalt vonSo legen Sie die Zeilenhöhe in CSS fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
css
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage