Was sind die CSS-Textattribute?

CSS-Textattribute: 1. Farbattribut; 3. Zeilenhöhe; 4. Zeichenabstand; 6. Textrichtung (Unicode);

CSS-Texteigenschaften:

(Teilen von Lernvideos: Java-Video-Tutorial)

color    设置文本颜色    
direction    设置文本方向。    
line-height    设置行高。    
letter-spacing    设置字符间距。    
text-align    对齐元素中的文本。    
text-decoration    向文本添加修饰。    
text-indent    缩进元素中文本的首行。    
text-shadow    设置文本阴影。CSS2 包含该属性，但是 CSS2.1 没有保留该属性。    
text-transform    控制元素中的字母。    
unicode-bidi    设置文本方向。    
white-space    设置元素中空白的处理方式。    
word-spacing    设置字间距。

CSS-Texteigenschaften definieren das Erscheinungsbild von Text.

Mit den Texteigenschaften können Sie die Textfarbe und den Zeichenabstand ändern, Text ausrichten, Text verzieren, Text einrücken und vieles mehr.

1. Text einrücken

CSS bietet das Attribut text-indent, mit dem sich Texteinrückungen problemlos implementieren lassen.

Durch die Verwendung des text-indent-Attributs kann die erste Zeile aller Elemente um eine bestimmte Länge eingerückt werden, auch wenn die Länge ein negativer Wert sein kann.

Die häufigste Verwendung dieses Attributs besteht darin, die erste Zeile eines Absatzes einzurücken. Mit der folgenden Regel wird die erste Zeile aller Absätze um 5 cm eingerückt:

p {text-indent: 5em;}

Hinweis: Im Allgemeinen kann text- auf alle Blöcke angewendet werden -level-Elemente, aber das Attribut kann nicht auf Inline-Elemente angewendet werden, noch kann das text-indent-Attribut auf Ersatzelemente wie Bilder angewendet werden. Wenn jedoch ein Element auf Blockebene (z. B. ein Absatz) in der ersten Zeile ein Bild enthält, wird es mit dem Rest des Textes in dieser Zeile verschoben.

Tipp: Wenn Sie die erste Zeile eines Inline-Elements „einrücken“ möchten, können Sie den linken Abstand oder den Rand verwenden, um diesen Effekt zu erzielen.

2. Horizontale Ausrichtung

text-align ist ein grundlegendes Attribut, das die Ausrichtung von Textzeilen in einem Element untereinander beeinflusst. Die ersten drei Werte sind ziemlich einfach, der vierte und fünfte sind jedoch etwas komplizierter.

Die Werte left, right und center bewirken, dass der Text im Element linksbündig, rechtsbündig bzw. zentriert ist.

Tipp: Zentrieren Sie Elemente auf Blockebene oder Tabellenelemente, indem Sie den linken und rechten Rand dieser Elemente entsprechend festlegen.

3. Wortabstand

Das Wortabstandsattribut kann den Standardabstand zwischen Wörtern (Wörtern) ändern. Der Standardwert „Normal“ entspricht der Einstellung auf 0.

Das Wortabstandsattribut akzeptiert einen positiven oder negativen Längenwert. Wenn ein positiver Längenwert angegeben wird, vergrößert sich der Abstand zwischen den Wörtern. Das Festlegen eines negativen Werts für den Wortabstand bringt es näher:

p.spread {word-spacing: 30px;}
p.tight {word-spacing: -0.5em;}

<p class="spread">
This is a paragraph. The spaces between words will be increased.
</p>

<p class="tight">
This is a paragraph. The spaces between words will be decreased.
</p>

4. Buchstabenabstand

Der Unterschied zwischen der Eigenschaft „Buchstabenabstand“ und dem Wortabstand besteht darin, dass der Buchstabenabstand den Abstand zwischen Zeichen oder Buchstaben ändert.

Wie beim Wortabstandsattribut umfassen die möglichen Werte für das Buchstabenabstandsattribut alle Längen. Das Standardschlüsselwort ist „normal“ (dasselbe wie „letter-spacing:0“). Der eingegebene Längenwert vergrößert oder verkleinert den Abstand zwischen den Buchstaben um den angegebenen Betrag:

h1 {letter-spacing: -0.5em}
h4 {letter-spacing: 20px}

<h1>This is header 1</h1>
<h4>This is header 4</h4>

Verwandte Empfehlungen: CSS-Tutorial

Das obige ist der detaillierte Inhalt vonWas sind die CSS-Textattribute?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!