So setzen Sie den Textabstand und die Platzierung in CSS

Beim Schreiben eines Dokuments muss man den Text richtig organisieren. Auf diese Weise können Benutzer den Inhaltsfluss verstehen und beim Lesen des Dokuments helfen. Dazu müssen ordnungsgemäße Textanpassungen wie Eindrückung, Worträume, Ausrichtung, Richtung und mehr vorhanden sein. Insbesondere erlaubt CSS es uns, mehrere Eigenschaften zu verwenden, um den Textabstand und die Platzierung anzupassen.

Das Ergebnis dieses Artikels wird sein:

• Was ist Textabstand?
• So verwenden Sie CSS -Textabstandseigenschaften
• Was sind CSS -Textplatzierungseigenschaften?
• So verwenden Sie CSS -Textplatzierungseigenschaften?

Was ist Textabstand?

Der Textabstand bezieht sich auf die Menge an Platz unter dem jeweiligen Text. Mehrere CSS -Eigenschaften werden zum Hinzufügen von Leerzeichen zum Text verwendet.

So verwenden Sie CSS -Textabstandseigenschaften?

Um Räume innerhalb des Textes bereitzustellen, ermöglicht CSS es uns, verschiedene Eigenschaften zu verwenden, die unten aufgeführt sind:

• weißer Raum
• Texteinzug
• Wortabstand
• Zeilenhöhe
• Buchstaben-Abstand

Beispiel 1: Wie man den Text des Elements einführt?

CSS “TexteinzugDie Eigenschaft wird verwendet, um der ersten Zeile eines Textes Einklebung hinzuzufügen. Um es zu verwenden, fügen Sie das Divelelement mit der Klasse hinzuEinzug”. Innerhalb dieses Divs hinzufügen

Tag für die Überschrift und

Tag zum Hinzufügen eines Absatzes.

Html

CSS-textindentes Eigentum

Der Textabstand bietet einen sehr ordentlichen Blick auf den geschriebenen Inhalt.
Der Text sollte in überschaubaren Stücken unterbrochen werden.

Stil „Einzug“ div

.Eindrückung
Breite: 350px;
Höhe: 200px;
textindent: 40px;
Rand: Auto;
Polsterung: 5px;
Hintergrundfarbe: #FFC107;
Grenze: 10px Solid #9E9E9E;

Die Liste der CSS -Eigenschaften, die auf die Einrückungs -DIV angewendet werden, wird unten erläutert:

• “BreiteEigenschaft wird für die Einstellung der Breite des Elements verwendet.
• “HöheEigenschaft wird verwendet, um die Höhe des Elements festzulegen.
• “Texteinzug"Eigenschaft wird mit dem Wert von" festgelegt "40px”, Der zu Beginn der ersten Zeile eines Absatzes 40px Raum repräsentiert.
• “Rand”Eigenschaft mit dem Wert als"Auto”Erzeugt einen gleichen Raum um das Element.
• “Polsterung”Eigenschaft mit dem Wert“5px”Fügen Sie den Raum von 5px um den Inhalt des Elements hinzu.
• “HintergrundfarbeEigenschaft gibt die Hintergrundfarbe des Elements an.
• “Grenze”Eigenschaft mit dem Wert als"10px fest #9e9e9e”Bedeutet die Grenzbreite, den Grenzstil und die Grenzfarbe.

Stil "H2" von "Eingegriffen" div

.Einzug H2
Textdekoration: 3px unterstreicht grau;

Der

Das Überschriftenelement des Einrückungs -Divs wird angewendetTextdekoration”Eigenschaft mit dem Wert“3px unterstreichen grau" bei dem die "3px"Repräsentiert die Breite der Linie", "unterstreichen”Repräsentiert die Zeile unter dem Text und“grau”Ist die Farbe.

Ausgang

Beispiel 2: So fügen Sie weiße Räume innerhalb des Elements hinzu?

Der "CSS-WeißraumEigenschaft gibt die weißen Space innerhalb des jeweiligen Elements an. Diese Eigenschaft basiert auf den folgenden Werten:

• normal
• Nowrap
• vor der Handelung
• Vor
• Vorlinie
• Breakpaces

Html

Geben Sie in CSS die Eigenschaft Weißraum mit dem Wert an “Vorlinie”:

weißer Raum: Vorline;

Ausgang

Beispiel 3: So fügen Sie Räume zwischen den Wörtern hinzu?

Das CSS “WortabstandDie Eigenschaft wird verwendet, um die Räume zwischen dem Text des Elements anzugeben. Diese Eigenschaft ist den folgenden Werten zugeordnet:

• Länge
• normal
• Initial
• erben

Schau dir das Beispiel an!

In diesem Beispiel werden wir also das hinzufügen “Wortabstand”Eigenschaft mit dem Wert“30px”:

Wortabstand: 30px;

Ausgang

Beispiel 4: So fügen Sie Räume zwischen den Zeilen hinzu?

Der "ZeilenhöheDie Eigenschaft wird verwendet, um den vertikalen Raum zwischen den Textzeilen anzugeben.

Hier in diesem Beispiel wird die Eigenschaft zur Linienhöhe mit dem Wert verwendet “3em”:

Linienhöhe: 3em;

Ausgang

Beispiel 5: So fügen Sie Leerzeichen zwischen den Textzeichen hinzu?

Das CSS “Buchstaben-AbstandDie Eigenschaft wird zum Hinzufügen der Leerzeichen zwischen den Textzeichen verwendet.

Hier wird das Element mit der Buchstabenabstandseigenschaft mit dem Wert von “versehen“-1px”In CSS:

Buchstabenabteilung: -1px;

Ausgang

Was sind Textplatzierungseigenschaften?

Die Textplatzierung bezieht sich auf die Textausrichtung. Es bedeutet die Textposition als links, rechts und vieles mehr im Zusammenhang mit dem Textinsertionspunkt.

So verwenden Sie CSS -Textplatzierungseigenschaften?

Im Folgenden finden Sie die Eigenschaften, die verwendet werden können, um die Textplatzierung anzupassen.

• Text-Align-Last
• Textausrichtung
• vertikaler Ausrichtung
• Richtung
• Unicode-Bidi

Beispiel 1: So richten Sie die letzte Zeile des Elementtextes aus?

Das CSS “Text-Align-LastDie Eigenschaft wird verwendet, um die Ausrichtung der letzten Zeile des Textes anzupassen. In unserem Fall haben wir die text-Align-Last-Eigenschaft als „Recht“ festgelegt:

Text-Align-Last: Recht;

Ausgang

Beispiel 2: So richten Sie den Text horizontal in HTML aus?

Das CSS “TextausrichtungDie Eigenschaft wird verwendet, um den Text horizontal auszurichten. Zum Beispiel haben wir seinen Wert als "als" festgelegt "Rechts”:

Text-Align: Recht;

Ausgang

Beispiel 3: Wie man Text vertikal in HTML ausrichtet?

Der "vertikaler AusrichtungDie Eigenschaft des CSS wird verwendet, um den Text vertikal auszurichten.

Um diese Eigenschaft zu nutzen, fügen Sie eine hinzu "

Element zum Hinzufügen eines Absatzes zum gewünschten Dokument. Dieser Absatz besteht aus den Elementen an bestimmten Stellen mit ID als “aus den ElementenSuperscript”:

Textausrichtung Bietet die Leser mit einem visuell
logischer Text.

In CSS das Element mit ID “Superscript”Wird mit den folgenden Eigenschaften gestaltet:

#Superscript
Hintergrundfarbe: RGB (3, 162, 11);
vertikaler Align: Super;

Hier:

• “HintergrundfarbeDie Eigenschaft wird verwendet, um die Hintergrundfarbe des Elements festzulegen.
• “vertikaler Ausrichtung" Eigentumswert "super”Wird den Text etwas vertikal oben ausrichten.

Ausgang

Beispiel 4: So ändern Sie die Textrichtung?

Das CSS “RichtungDie Eigenschaft wird verwendet, um die Textrichtung des Elements zu ändern.

In CSS die Richtungseigenschaft mit dem Wert “RTL”Wird angegeben, um die Richtung des Elements von rechts nach links zu machen:

Richtung: RTL;

Ausgang

Beispiel 5: So umgehen mit bidirektionalem Text in HTML?

Um den bidirektionalen Text in einem Dokument zu bewältigen, das CSS “Unicode-BidiImmobilien werden genutzt. Der bidirektionale Text bezieht sich auf das Dokument, das Text in beide Richtungen, rechts und links und nach rechts Text hat. Der bidirektionale Text existiert normalerweise im Dokument mit mehreren Sprachen, die mit der “festgelegt werden könnenRichtung" Eigentum.

Fügen Sie für die Demonstration den folgenden Code in die CSS -Datei hinzu:

Richtung: RTL;
Unicode-Bidi: Bidi-Override;

Hier:

• “Richtung"Eigenschaft wird mit dem Wert festgelegt"RTLDas zeigt die Richtung rechts nach links des Textes an.
• “Unicode-Bidi”Eigenschaft mit dem Wert als"Bidi-Override”Wird verwendet, um anzugeben, ob der angegebene Text überschrieben werden soll, um mehrere Sprachen in einem Dokument zu unterstützen.

Ausgang

Es ging darum, den Textabstand und die Platzierung in CSS anzupassen.

Abschluss

Beim Schreiben eines Dokuments ist es sehr notwendig, das Format und den Stil des Dokuments zu berücksichtigen. Ein gut formatiertes Dokument erzeugt keine Lesbarkeitsprobleme. Dazu bietet CSS uns unterschiedliche Eigenschaften, die beim Abstand und zur Platzierung des Textes in HTML helfen. Einige der Eigenschaften sind “Textausrichtung","Richtung","Text-Align-Last", und mehr. Dieser Beitrag hat verschiedene CSS -Eigenschaften demonstriert, die bei den Einstellungen zur Ausrichtung der Text und der Platzierung von HTML -Dokumenten helfen.