Einführung in die CSS-Textformatierung
In früheren Tagen mussten Sie den Text nur mit der alten CSS-Version darstellen. Sie hatten ein Tag, um die Schattierung und Schriftart des Inhalts zu ändern. Die Messung wurde jedoch durch die Verwendung der vordefinierten Textabmessungen behindert. Die verschiedenen Einflüsse wie Intensität und Durchschlag waren mit Hilfe von HTML-Labels in nur grundsätzlichen Strukturen denkbar. Gegenwärtig kann der Benutzer eine Vielzahl von CSS-Textformatierungseigenschaften verwenden, um den Text auf den Webseiten auf seine Weise anzuordnen.
In diesem Kapitel werden Sie zahlreiche CSS-Textformatierungseigenschaften sehen. CSS-Textformatierungseigenschaften werden verwendet, um den Text zu entwerfen, den Text zu formatieren, einige Formatierungsstile zu beschreiben usw. Die Eigenschaften bieten Ihnen die visuelle Darstellung der Zeichen, Leerzeichen, Wörter, Absätze und vieles mehr.
Liste der CSS-Textformatierungseigenschaften:
Details zu den Textformatierungsmethoden in CSS: -
1) Textfarbe
Mit dieser Eigenschaft kann die Farbe des Texts geändert werden. Sie kann mithilfe der Farbeigenschaft definiert werden.
Beispiel : Darstellung der Textfarbe
CSS Text Color Property
Hallo Welt….
Willkommen bei EDUCBA…
Es wird die folgende Ausgabe angezeigt:
2) Textausrichtung
Diese Eigenschaft kann verwendet werden, um die Horizontale des Texts zu ändern. Sie kann definiert werden, indem Eigenschaften left, right, center und justify verwendet werden.
Beispiel : Darstellung der Textausrichtung
Text Alignment Property
Hallo Welt…
Willkommen bei EDUCBA …
Bildungsberater…
Es wird die folgende Ausgabe angezeigt:
3) Textdekoration
Diese Eigenschaft kann verwendet werden, um den Text zu dekorieren. Sie kann mithilfe von Unterstreichungs-, Überstreichungs- und Durchleitungseigenschaften definiert werden.
Beispiel : Darstellung der Textdekoration
Text DecorationProperty
Hallo Welt…
Willkommen bei EDUCBA …
Bildungsberater…
Es wird die folgende Ausgabe angezeigt:
4) Texttransformation
Mit dieser Eigenschaft können Sie die Groß- und Kleinschreibung des Texts ändern. Sie kann mithilfe von Groß- und Kleinschreibungseigenschaften definiert werden.
Beispiel : Darstellung der Texttransformation
Text Transformation Property
Hallo Welt…
Willkommen bei educba …
Bildungsberater…
Es wird die folgende Ausgabe angezeigt:
5) Texteinzug
Mit dieser Eigenschaft kann die erste Textzeile eingerückt werden. Sie kann mit den Eigenschaften px, cm, pt definiert werden.
Beispiel : Abbildung eines Texteinzugs
Text Indentation Property
Hallo Welt…
Willkommen bei Educba …
Bildungsberater…
Es wird die folgende Ausgabe angezeigt:
6) Wortabstand
Diese Eigenschaft kann verwendet werden, um Leerzeichen zwischen Wörtern zu setzen. Sie kann mithilfe der Wortabstandseigenschaft definiert werden.
Beispiel : Darstellung des Wortabstands
Word Spacing Property
Hallo Welt…
Willkommen bei Educba …
Bildungsberater…
Es wird die folgende Ausgabe angezeigt:
7) Buchstabenabstand
Diese Eigenschaft kann verwendet werden, um Leerzeichen zwischen Zeichen zu setzen. Sie kann mithilfe der Buchstabenabstandseigenschaft definiert werden.
Beispiel : Darstellung des Buchstabenabstands
Letter Spacing Property
Hallo Welt…
Willkommen bei Educba …
Bildungsberater…
Es wird die folgende Ausgabe angezeigt:
8) Linienhöhe
Diese Eigenschaft kann verwendet werden, um Leerzeichen zwischen den Zeilen zu setzen. Sie kann mithilfe der Eigenschaft line-height definiert werden.
Beispiel : Darstellung der Zeilenhöhe
Line Height Property
h3
(
line-height:2.5;
)
h4
(
line-height:150%;
)
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) ist ein
führender globaler Anbieter von kompetenzbasierter Ausbildung
Bei eduCBA ist es uns ein Anliegen, berufsorientiert zu sein
Praktische Kurse für jedermann, zu jeder Zeit und an jedem Ort.
Es wird die folgende Ausgabe angezeigt:
9) Textrichtung
Mit dieser Eigenschaft kann die Textrichtung geändert werden. Sie kann mit der Eigenschaft rtl definiert werden. Es legt die Richtung von rechts nach links fest.
Beispiel : Darstellung der Textrichtung
Text Direction Property
Hallo Welt … Willkommen bei Educba …
Es wird die folgende Ausgabe angezeigt:
10) Textschatten
Diese Eigenschaft kann verwendet werden, um Schatten für den Text zu geben. Sie kann mithilfe der Eigenschaft text-shadow definiert werden. Es werden Komponenten wie die linke Position, die obere Position, die Größe der Unschärfe und der Farbname verwendet.
Beispiel : Illustration eines Textschattens
Text Shadow Property
h3
(
text-shadow:3px 3px 2px lightblue;
)
h4
(
text-shadow:3px 3px 2px plum;
)
Hallo Welt … Willkommen bei EDUCBA …
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) ist eine kompetenzbasierte Ausbildung
Es wird die folgende Ausgabe angezeigt:
11) Ems
Dies ist eine skalierbare Maßeinheit. Diese Eigenschaft kann verwendet werden, um die Größe des Texts entsprechend dem umgebenden Text zu definieren. Die Standardgröße des Texts ist 1em, was 12pt entspricht. 2em ist gleich 24pt und so weiter.
Beispiel : Darstellung der ems-Liegenschaft
Ems Property
h3
(
font-size: 0.8em;
)
h4
(
font-size: 1.2em;
)
Hallo Welt … Willkommen bei EDUCBA …
EDUCBA (Corporate Bridge Consultancy Pvt Ltd) ist eine kompetenzbasierte Ausbildung
Es wird die folgende Ausgabe angezeigt:
12) Schriftfamilie
Diese Eigenschaft wird verwendet, um verschiedene Typen von Schriftfamiliennamen für den ausgewählten Text bereitzustellen. Zum Beispiel Helvetica, Calibri, Arial, Serifenlos, Times, Courier New usw.
Beispiel : Abbildung der Eigenschaft font-family
Font Family Property
Hallo Welt…
Willkommen bei Educba …
Bildungsberater…
Es wird die folgende Ausgabe angezeigt:
Fazit
Bisher haben wir uns mit Textformatierungsmethoden in CSS befasst. Sie konnten sehen, dass der Text mit verschiedenen Arten von Textformatierungseigenschaften dargestellt wird. Diese Eigenschaften sind sehr wichtige Aspekte von CSS, um den Text auf der Webseite anzuzeigen, damit Benutzer oder Leser durch das Anzeigen Ihres Texts auf der Website angesprochen werden können. Nutzen Sie diese Texteigenschaften sehr einfach und effektiv auf den Webseiten.
Empfohlene Artikel
Dies war eine Anleitung zur CSS-Textformatierung. Hier haben wir eine Einführung und Liste der CSS-Textformatierungseigenschaften im Detail mit den Beispielcodebeispielen und der richtigen Ausgabe besprochen. Sie können auch unsere anderen Artikelvorschläge durchgehen, um mehr zu erfahren -
- Was ist CSS?
- SASS vs CSS
- CSS-Befehle
- CSS3 Interview Fragen