Einzug ist ein horizontaler Abstand, der zwischen dem linken Rand des Textbereichs und dem Anfang eines Absatzes platziert wird. Wenn Sie die Größe des Absatzeinzugs richtig einstellen, können Sie den Text lesbarer, sauberer und lesbarer machen.
In diesem Handbuch werden mehrere Möglichkeiten zum Anpassen der Absatzgröße in HTML beschrieben.
Der erste Weg besteht darin, das Inline-CSS des Stils zu verwenden. Fügen Sie dazu dem Tag ein style-Attribut hinzu und geben Sie einen Wert für die Eigenschaft margin-left oder padding-left an. Zum Beispiel:
Absatztext
Der zweite Weg ist die Verwendung von CSS-Klassen. Wir können eine Klasse mit den gewünschten Absatzeinrückungswerten erstellen und sie auf alle gewünschten Absätze anwenden. Zum Beispiel:
.indent
margin-left: 20px;
padding-left: 20px;
>
Absatztext
Wenn Sie eine dieser Methoden auswählen, können Sie die Größe des Absatzeinzugs in Ihrem HTML-Code leicht anpassen und den Text leichter lesen.
Ändern der Größe eines Absatzeinzugs in HTML: Schritt für Schritt
Schritt 1: Beginnen Sie mit dem Erstellen eines Stils, um den Einzug zu ändern. Fügen Sie den folgenden Code zwischen den Tags ein
und in Ihrem HTML-Dokument:.paragraph
Im obigen Code haben wir eine Klasse namens "paragraph" erstellt. Diese Klasse wird auf die Tags angewendet
, um ihren Einzug zu ändern.
Schritt 2: Wenden Sie den Stil auf einen Absatz an, indem Sie dem Tag die Klasse "paragraph" hinzufügen
. So wird es gemacht:
Текст вашего абзаца
Sie können den Einrückungswert ändern, indem Sie den Wert der Margin-Eigenschaft in der CSS-Klasse "paragraph" ändern. Wenn Sie beispielsweise den Einzug kleiner machen möchten, können Sie den Wert in 10px ändern:
.paragraph
Infolgedessen haben Absätze mit der Klasse "paragraph" einen kleineren Einzug.
Das Ändern der Größe eines Absatzeinzugs in HTML mit CSS ist ziemlich einfach, und Sie können die Einrückung je nach Ihren Textformatierungsanforderungen variieren.
Definieren eines Absatzeinzugs
Der Wert für den Absatzeinzug kann in Pixeln, Prozentsätzen oder anderen Maßeinheiten angegeben werden. Normalerweise wird ein Wert in Pixeln verwendet, da er die Größe des Einrückens genauer steuert. Der Wert kann entweder positiv oder negativ sein:
- Positiv Absatzeinzug - Wenn ein Wert angibt, dass ein Absatz relativ zum linken Rand der Seite oder des Containers nach rechts zurückgezogen werden soll.
- Negativ Absatzeinzug - Wenn ein Wert angibt, dass ein Absatz relativ zum linken Rand der Seite oder des Containers nach links zurückgezogen werden soll.
Um einen Absatzeinzug in HTML festzulegen, können Sie die CSS-Eigenschaft margin-left verwenden. Um beispielsweise einen positiven Absatzeinzug von 20 Pixeln festzulegen, können Sie den folgenden Code verwenden:
Текст абзаца
Sie können auch externes CSS verwenden, um einen Absatzeinzug festzulegen:
p Текст абзаца
Durch die Verwendung von Absatzeinzügen können Sie das Aussehen von Absätzen steuern und klareren und lesbareren Text erstellen.
Angeben der Einrückungsgröße über die CSS-Eigenschaft
Verwenden Sie die Margin-Eigenschaft, um die Größe des Absatzeinzugs in CSS anzugeben. Mit dieser Eigenschaft können Sie die Einrückung für alle vier Seiten des Blocks festlegen: oben, rechts, unten und links.
Die Syntax der Margin-Eigenschaft lautet wie folgt:
- margin: Wert; - legt den gleichen Einzug für alle vier Seiten fest.
- margin: Wert1 Wert2; - Legt den Einzug für die oberen und unteren Seiten des Blocks sowie für die linken und rechten Seiten fest.
- margin: wert1 Wert2 Wert3 Wert4; - Legt die Einrückung für die oberen, rechten, unteren und linken Seiten des Blocks fest.
Der Einrückungswert kann in verschiedenen Maßeinheiten wie Pixeln ( px ), Prozentwerten ( % ), relativen Werten ( em , rem ) und anderen angegeben werden.
Um beispielsweise einen Einzug von 10 Pixeln für alle Seiten eines Blocks festzulegen, verwenden Sie die folgende CSS-Regel:
Wenn Sie nur die oberen und unteren Seiten des Blocks einrücken möchten, können Sie die folgende CSS-Regel verwenden:
Und wenn Sie die Einzüge für alle Seiten des Blocks einzeln festlegen möchten, ist dies ungefähr so:
Neben der Eigenschaft margin können Sie die Einrückung für die oberen, rechten, unteren und linken Seiten des Blocks auch separat mit den separaten Eigenschaften margin-top , margin-right , margin-bottom und margin-left angeben.
Verwenden von Pixelwerten
Wenn Sie beispielsweise einen Absatzeinzug auf 10 Pixel festlegen möchten, verwenden Sie den folgenden CSS-Code:
Dieser Code legt den Absatz auf allen Seiten mit 10 Pixeln Einzug fest.
Die Werte in Pixeln sind besonders nützlich, wenn Sie die Größe des Einrückens genau steuern und für verschiedene Elemente den gleichen Einzug sicherstellen möchten.
Beachten Sie jedoch, dass die Pixelwerte nicht skaliert werden und bei Geräten mit unterschiedlichen Auflösungen möglicherweise außerhalb des Bildschirms liegen. Daher wird empfohlen, die Werte in Pixeln mit Vorsicht zu verwenden und nur dann anzuwenden, wenn eine genaue Kontrolle über die Größe des Absatzeinzugs erforderlich ist.
Anwenden von Einrückungen auf bestimmte Elemente
Wenn Sie die Einrückung nur auf bestimmte Elemente Ihrer Webseite anwenden müssen, können Sie Klassen oder IDs verwenden.
Um zu beginnen, müssen Sie eine Klasse oder eine ID in Ihrem Stylesheet definieren. Zum Beispiel würde eine Klasse mit dem Namen "Einzug" wie folgt aussehen:
.отступ
Sie können diese Klasse dann auf die Elemente anwenden, auf die Sie die Einrückung anwenden möchten. Dazu müssen Sie den entsprechenden HTML-Tags ein Attribut "class" oder "id" hinzufügen. Zum Beispiel:
Этот абзац применяет отступы.
In diesem Beispiel werden die Einrückungen auf einen Absatz angewendet, der eine Einrückungsklasse aufweist. Alle Absätze ohne diese Klasse bleiben ohne Einzug erhalten.
Sie können auch IDs anstelle von Klassen verwenden, wenn Sie Einrückungen auf ein einzelnes Element anwenden müssen. In diesem Fall müssen Sie eine ID in Ihrem Stylesheet definieren und sie mithilfe des Attributs "id" auf das HTML-Tag anwenden. Zum Beispiel:
#отступ
Durch die Verwendung von Klassen und IDs können Sie punktuell steuern, wie Einrückungen auf Ihre Elemente angewendet werden, wodurch Ihr Code flexibler und einfacher zu verwalten ist.
Laden eines externen Stils für globale Änderungen
Sie können einen äußeren Stil verwenden, um die Größe des Absatzeinzugs für das gesamte Dokument anzupassen. Mit einem externen Stil können Sie bestimmte Stile für alle Elemente auf einer Webseite festlegen.
Zuerst müssen Sie eine Datei mit Stilen mit einer Erweiterung erstellen.css. Zum Beispiel können Sie es style nennen.css. In dieser Datei können Sie verschiedene Stile festlegen, z. B. Schriftarten, Farben, Einrückungen und vieles mehr.
Nachdem Sie die Stildatei erstellt haben, müssen Sie sie mit dem HTML-Dokument verbinden. Verwenden Sie dazu ein Tag . Das href-Attribut gibt den Pfad zur Datei mit Stilen an, und das rel-Attribut gibt den Wert "stylesheet" an, damit der Browser erkennt, dass es sich um eine Datei mit Stilen handelt.
Beispielcode zum Verbinden einer Datei mit Stilen:
Nachdem Sie eine Datei mit Stilen angehängt haben, werden alle auf die Elemente auf der Seite angewendeten Stile aus dieser Datei übernommen.
Sie können die Margin-Eigenschaft in einer Formatvorlagendatei verwenden, um die Größe des Absatzeinzugs anzupassen. Wenn Sie beispielsweise einen Einzug von 20 Pixeln für alle Absätze auf einer Seite festlegen möchten, können Sie den folgenden Code verwenden:
In diesem Beispiel geben wir an, dass für alle Elemente
es muss ein Abstand von 20 Pixeln auf allen Seiten angewendet werden.
Durch das Anwenden eines externen Stils können Sie die Größe von Absätzen auf der gesamten Website leicht ändern, ohne dass Sie jeden einzelnen Absatz innerhalb der HTML-Datei ändern müssen.