Es gibt verschiedene Methoden zum Einrücken von text. Aus Gründen der Kompatibilität mit mehreren Browsern und der Zugänglichkeit besprechen wir jedoch die gängigsten Methoden zum Einrücken von Text auf Ihrer Webseite.
Empfohlene Methode mit CSS & HTML
Zum Einrücken von Text oder Absatz wäre die am häufigsten verwendete und empfohlene Methode die Verwendung von CSS. Im Folgenden finden Sie verschiedene Beispiele, wie CSS Text einrücken kann., Jedes dieser Beispiele würde platziert werden zwischen Ihrem <head></Kopf> – HTML-tags.
Das folgende Beispiel würde eine Stilklasse namens „tab“ erstellen, die den Text und Absatz 40 Pixel von links einrückt.
<style type="text/css"><!-- .tab { margin-left: 40px; }--></style>
Sobald sich der obige Code im Abschnitt <head> befindet, können Sie ihn verwenden, indem Sie ihn zu Ihrem Absatz hinzufügen (<p>) Tags wie gezeigt.,
<p class="tab">Example of a tab</p>
Das Einfügen von CSS in Ihr HTML-Dokument wird wie oben gezeigt als“ Inline “ – CSS bezeichnet. Es ist nützlich, um schnell Änderungen vorzunehmen, aber auf lange Sicht ist es schwierig, später zu ändern.
Stattdessen können Sie Ihren gesamten CSS-Code in eine separate Datei mit der Erweiterung einfügen .CSS. Dann können Sie von jedem HTML-Dokument aus eine Verknüpfung zu dieser Datei herstellen, und dieses Dokument kann diese CSS-Eigenschaften verwenden. Die Verwendung einer externen CSS-Datei erleichtert das spätere Ändern des CSS, da das gesamte CSS an einer Stelle definiert ist.
<link rel="stylesheet" Type="text/css" href="http://www.example.com/basic.css">
Einmal diese .,css-Datei erstellt wurde, bearbeiten Sie die Datei und fügen Sie den gleichen CSS-Code, mit Ausnahme der <style> und Kommentar-Tags in sie, wie gezeigt.
.tab { margin-left: 40px; }
Schließlich, sobald die obigen Schritte abgeschlossen sind, können Sie jeden Text mit der gleichen <p class=“tab“> Beispiel, das wir oben gezeigt haben.
Es gibt auch andere Formen des Einrückens. Wenn Sie beispielsweise nur die erste Zeile eines Absatzes einrücken möchten, anstatt die obige CSS-Zeile zu verwenden, verwenden Sie die folgende Zeile.,
.tab { text-indent:40px }
Sie können auch mit einem Prozentsatz einrücken. Anstatt beispielsweise mit 40 Pixel (Pixel) einzurücken, können Sie den Einzug durch 5% ersetzen, um Text durch 5% der aktuellen Ansicht einzurücken. Sie können auch ein Em-Leerzeichen verwenden, wenn Sie die Breite eines Eindrucks definieren.
Sie können auch den von einem linken Einzug in einen rechten Einzug ändern, indem Sie den Rand von links nach rechts ändern.
Empfohlene Methode mit HTML
Es ist möglich, die gleichen Ergebnisse mit einem Inline-Stil in HTML zu erzielen., Wenn Sie das obige CSS-Beispiel verwenden, kann es einfacher sein, es über mehrere Webseiten hinweg zu verwalten, wenn Sie einen Stil nur einmal verwenden müssen, können Sie das folgende Beispiel verwenden.
<p style="margin-left: 40px">This text is indented.</p>
In diesem ersten Beispiel ist der gesamte Text im Absatz-Tag 40 Pixel von links eingerückt. Alle anderen Absatz-Tags sind nicht eingerückt.
<p style="text-indent: 40px">This text is indented.</p>
In diesem zweiten Beispiel wird nur die erste Textzeile im Absatz 40 Pixel von links eingerückt. Zusätzliche Textzeilen in diesem Absatz sind nicht eingerückt.,
Sie können auch mit einem Prozentsatz einrücken. Anstatt beispielsweise mit 40 Pixel (Pixel) einzurücken, können Sie den Einzug durch 5% ersetzen, um Text durch 5% der aktuellen Ansicht einzurücken. Sie können auch ein Em-Leerzeichen verwenden, wenn Sie die Breite eines Eindrucks definieren.
Sie können auch den von einem linken Einzug in einen rechten Einzug ändern, indem Sie den Rand von links nach rechts ändern.
Alternative Methode
Eine andere gängige (aber falsche) Methode zum Einrücken von Text ist die <blockquote> – Tags, wie im folgenden Beispiel gezeigt., Obwohl dies eine einfachere Lösung ist, werden Zugänglichkeitsprobleme eingeführt. Dieses Tag dient zum Zitieren von Text und nicht zum Einrücken.
<blockquote>This text would be indented</blockquote>
Zusätzliche Informationen
- Müssen Sie beim Schreiben von HTML-Code einrücken?
- So erstellen Sie zusätzlichen Speicherplatz in HTML oder einer Webseite.
- Siehe die Einrückungsdefinition für verwandte Informationen und Links.
- HTML und Webdesign Hilfe und Unterstützung.
