So fügen Sie Zeilenumbrüche mithilfe von CSS-Eigenschaften hinzu. So umbrechen Sie Text in einer Zelle in Excel. Zur nächsten HTML-Zeile wechseln
Bei der Anzeige von Textdokumenten in einem Browser wird die Position von Zeilenumbrüchen innerhalb eines Absatzes automatisch abhängig von der Größe der Schriftarten und der Größe des Anzeigefensters bestimmt. Zeilenumbrüche können nur durch Worttrennzeichen (z. B. Leerzeichen) durchgeführt werden. Manchmal müssen Sie in Dokumenten einen erzwungenen Zeilenvorschub festlegen, der unabhängig von den Browsereinstellungen implementiert wird. Dies geschieht mithilfe des Forced-Line-Feed-Tags.
, das kein entsprechendes schließendes Tag hat. Aktivieren eines Tags
Durch Einfügen in den Dokumenttext wird sichergestellt, dass nachfolgender Text am Anfang einer neuen Zeile platziert wird. Dieser Ansatz kann beispielsweise verwendet werden, um listenartige Strukturen zu erstellen, ohne spezielle Listen-Markup-Tags zu verwenden. Oder dieser Tag kann beispielsweise nicht zum Anzeigen von Gedichten usw. verwendet werden.
Hier ist ein Beispiel für die Verwendung von erzwungenem Zeilenvorschub (Abb. 1.8):
Verwendung von erzwungenem ZeilenvorschubÜberdunkles Petrograd
Der November atmete die Herbstkälte ein.
Plätschern mit einer lauten Welle
Bis an die Ränder deines schlanken Zauns,
Neva warf sich hin und her wie eine kranke Person
Unruhig in meinem Bett.
A. S. Puschkin. Bronzener Reiter
Reis. 1.8. Etikett
kann verwendet werden, um einen Zeilenvorschub zu erzwingen
Im Gegensatz zum Absatz-Tag
Bei Verwendung des Tags
Es wird kein leerer String generiert.
Verwenden eines Tags
erfordert Vorsicht – es ist möglich, dass der Browser bereits ein oder zwei Wörter einen Zeilenumbruch vorgenommen hat, bevor er auf Ihr Tag gestoßen ist
. Dies geschieht, wenn die Breite des Viewer-Fensters des Readers kleiner ist als die gleiche Einstellung des Programms, mit dem Sie Ihr Dokument getestet haben. In diesem Fall kann es vorkommen, dass in der Mitte eines Absatzes nur noch ein Wort in einer Zeile verbleibt, wodurch die Schönheit des Dokumentlayouts beeinträchtigt wird.
Notiz
Bei Verwendung des Tags
Um Text um ein Bild oder eine Tabelle herum umzubrechen, können Sie den Parameter CLEAR so einstellen, dass der Textumbruch gestoppt wird. Dies können Sie in den Kapiteln 3 und 4 nachlesen.
Stichworte u
Es gibt Situationen, in denen Sie den umgekehrten Vorgang ausführen müssen – den Zeilenvorschub deaktivieren. Dafür gibt es einen Container-Tag . Mit diesem Tag markierter Text passt unabhängig von seiner Länge garantiert in eine Zeile. Wenn die resultierende Zeile über das Anzeigefenster des Browsers hinausgeht, wird eine horizontale Bildlaufleiste angezeigt.
Notiz
Um die Kontinuität von Text in Tabellenzellen sicherzustellen, gibt es einen speziellen Parameter des NOWRAP-Tags
. Mehr dazu erfahren Sie in Kapitel 4. Markieren Sie Text mit einem nicht umbrechenden Zeilen-Tag Sie können sehr lange Saiten erhalten. Um dies zu vermeiden, können Sie dem Browser des Lesers die Position eines möglichen Zeilenvorschubs anzeigen, der nur bei Bedarf ausgeführt wird (der sogenannte „weiche“ Zeilenvorschub). Dies kann erreicht werden, indem ein Tag an der richtigen Stelle im Text platziert wird (Word BReak), das mit dem Tag identisch ist
, benötigt kein schließendes Tag. Notiz
Etikett wird vom Netscape-Browser überhaupt nicht unterstützt. Microsoft Internet Explorer erkennt dieses Tag nur in getaggtem Text .
Oft besteht die Notwendigkeit, einen neuen Absatz hinzuzufügen, jedoch ohne die Leerzeile, die das Absatz-Tag einfügt Für manche Textfragmente ist der Standard-Absatzabstand einfach ungeeignet. Dies können Beschriftungen unter Bildern und in Tabellen, Gedichten, Zitaten, Fußnoten und Anmerkungen sein. Um Zeilenumbrüche zu erzwingen, steht ein spezielles Tag zur Verfügung, dessen Funktion in seinem Namen br (break row – „eine Zeile, Zeile unterbrechen“) enthalten ist. Etikett
Hypertext Markup Language (HTML) bedeutet, dass alle darauf folgenden Inhalte in einer neuen Zeile beginnen müssen. Bei Bedarf können Sie mehrere Tags hintereinander hinzufügen, um den erforderlichen Abstand zu erreichen. Etikett
Dabei wird die Groß-/Kleinschreibung nicht beachtet und es ist kein schließendes Tag erforderlich, da es sich um ein leeres Element handelt. Es ist jedoch besser, sich daran zu gewöhnen, alle Tags zu schließen. In XHTML muss das Break-Tag mit einem Backslash „geschlossen“ werden. Beispiel für die Verwendung eines Break-TagsDer br-Tag in Aktion< /title></p><p><р>Abwesenheit von der Arbeit</р></p><p><p>Nirgendwo sonst und niemals <br></p><p>Mir ging es nicht so schlecht <br></p><p>Die Bosse sind eine gierige Horde <br></p><p>Mich bei lebendigem Leib zerfressen</р></p><p>Abwesenheit von der Arbeit</p><p>Nirgendwo sonst und niemals <br>Mir ging es nicht so schlecht. <br>Die Bosse sind eine gierige Horde <br>Mich bei lebendigem Leibe nagen.</p><h2>Tag-Attribut <br></h2><p>Das einzige Attribut, das ein HTML-Tag hat <br>, genannt Es teilt dem Browser mit, was mit dem Zeilenumbruch zu tun ist, wenn der Text um ein sogenanntes schwebendes Element umgebrochen werden muss, bei dem es sich beispielsweise um ein Bild mit einem Ausrichtungsattribut mit Rechts-/Links-Werten oder einen Block in CSS handeln kann das hat die Float-Eigenschaft.</p><p>In den Spezifikationen XHTML 1.0/HTML 4.01 kann das Attribut „clear“ nur mit Transitional, Frameset und verwendet werden<!DOCTYPE>, sonst funktioniert der Code nicht.</p><h2>Tag-Attributeigenschaften</h2><p>Die Wirkung des Attributs „clear“ hängt von seinem Wert und der Platzierung des schwebenden Elements ab. Das Attribut kann 4 Werte annehmen:</p><p><br clear = "right | left | all | none"></p><p><img src='https://i2.wp.com/fb.ru/misc/i/gallery/21147/458111.jpg' width="100%" loading=lazy loading=lazy></p><p>Der linke Wert verhindert, dass das linksbündige Element umbrochen wird, sodass der Text über das Tag stolpert <br>, wird unter dem Bild oder einem anderen schwebenden Element platziert.</p><p>Genau das gleiche Ergebnis erhält man, wenn man das all-Argument verwendet, das weder rechts noch links zulässt.</p><p>Der richtige Wert verhindert, dass Text um das rechtsbündige Element, also nach dem Tag, umbrochen wird <br>Der Text hat keine andere Wahl, als um das Bild herumzugehen und es nach rechts zu umfließen.</p><p>Der Wert none („weder deine noch unsere“) entfernt im Allgemeinen alle Befugnisse aus dem Attribut „clear“ und dem Tag <br>bewegt die Leine lautlos nach unten.</p><p>Das Attribut „clear“ des Tags hat keinen Standardwert als solchen.</p><h2>Etikett <br>- Dies ist eine sanfte Übertragung</h2><p>Das Zeilenumbruch-Tag ist sehr nützlich, um den notwendigen Abstand zwischen Absätzen zu schaffen, innerhalb dessen es als weicher Umbruch, aber nicht als Mittel zur Aufteilung von Text in Absätze verwendet wird.</p><p><img src='https://i0.wp.com/fb.ru/misc/i/gallery/21147/458084.jpg' width="100%" loading=lazy loading=lazy></p><p>Sie sollten sich beim Formatieren von Text nicht zu sehr mit dem Newline-Tag herumschlagen, da die Ergebnisse seiner Verwendung nicht immer elegant sind.</p><p>Zum Beispiel, wenn Sie das Tag verwenden <br>Um Zeilen innerhalb eines Absatzes umzubrechen, kann dies dazu führen, dass im Fenster des Benutzers ein „Kamm“ erscheint, wenn dieser kleiner ist als das Fenster, auf das der Webmaster abzielte.</p>
<p>Lektion 5.</p><h1></h1>
<p>In dieser Lektion: <br>1. Lassen Sie uns herausfinden, wie wir den HTML-Code für uns bequemer und leichter lesbar machen können. <br>2. Schauen wir uns an, wie man eine Textzeile richtig umbricht.</p>
<h2>Den HTML-Code bequem gestalten.</h2>
<p>Jetzt ist unser Code klar und leicht lesbar, da er wenig Text und praktisch keine Tags enthält. Wenn wir eine komplexere Seite erstellen, gibt es viele Tags, sodass es schwierig sein wird, das richtige zu finden.</p>
<p>Um ein Durcheinander von Tags zu vermeiden, müssen Sie Tags und Zeilen zunächst so anordnen, dass sie optisch besser erkennbar sind. Wenn der Browser Informationen von einer HTML-Seite liest, spielt es keine Rolle, wie viele Leerzeichen oder Leerzeilen der Code enthält.</p>
<p>Ich habe den Text im Seitencode relativ zu dem von uns erstellten geändert, aber das spielt keine Rolle. Das linke und das rechte Bild zeigen den gleichen Code. Beide Optionen werden vom Browser auf dem Monitorbildschirm exakt gleich angezeigt. Stimmen Sie zu, die Arbeit mit dem rechts gezeigten Code wird viel einfacher sein als mit dem links.</p>
<p>Der Code, den wir betrachten, ist sehr einfach, aber schon jetzt ist der Unterschied in der visuellen Wahrnehmung spürbar. Für „Ordnung“ gibt es keine konkreten Regeln, jeder Meister entscheidet selbst, wie er bequemer arbeiten kann.</p>
<h2>HTML-Zeilenumbruch. Tag <br>.</h2>
<p>Achten Sie auf das Bild. In der ersten Version ist der Text einzeilig geschrieben, in der zweiten Version zweizeilig.</p>
<br><img src='https://i1.wp.com/htmlboss.ru/image/lesson6-2.jpg' width="100%" loading=lazy loading=lazy><p>Der Browser zeigt beide Optionen gleich an. Der Text wird in einer Zeile geschrieben:</p>
<br><img src='https://i1.wp.com/htmlboss.ru/image/lesson6-3.jpg' width="100%" loading=lazy loading=lazy><p>Sie fragen sich, warum das so ist? Tatsächlich wird in einem der Codes ein Teil des Textes in eine andere Zeile verschoben. Es wäre logisch, wenn im Browser auch ein Teil des Textes in eine andere Zeile verschoben würde, aber HTML hat diesbezüglich seine eigene Logik. <u>Wenn wir im HTML-Code einen Zeilenumbruch vornehmen, entspricht dies für den Browser einem Leerzeichen</u>(wie ein regelmäßiger Abstand zwischen Wörtern im Text). Wenn wir einen Teil des Textes nicht um eine Zeile, sondern um 2 oder 3 (beliebige Zahl) nach unten verschieben, betrachtet der Browser diesen Abstand immer noch als einen regulären Abstand zwischen Wörtern und wenn er auf dem Bildschirm angezeigt wird, wird der Text in einer Zeile geschrieben .</p>
<h3>Tag <br></h3>
<p>Als wir uns in der dritten Lektion mit Tags vertraut machten, erwähnte ich, dass es Tags gibt, die nicht geschlossen werden müssen. Etikett <b><br></b> Einer davon wird für Zeilenumbrüche verwendet. <br>Wenden wir es im Code an:</p>
<img src='https://i2.wp.com/htmlboss.ru/image/lesson6-4.jpg' height="298" width="388" loading=lazy loading=lazy><p>Wir haben einen Tag eingefügt <b><br></b> in unseren HTML-Code und wenn Sie nun die Datei über den Browser starten, wird ein Teil des Textes in die nächste Zeile übertragen. <br> * <i>Vergessen Sie nicht, die Änderungen im Editor zu speichern (Strg + S) und die Seite im Browser zu aktualisieren (F5).</i></p>
<p>Beim Erstellen von Layouts stellen sich Webmaster regelmäßig die Frage: Wie wird der Text übertragen? In den meisten Fällen erledigt der Browser diese Aufgabe selbstständig. Aber manchmal muss dieser Prozess unter Kontrolle gebracht werden, insbesondere bei der Formatierung langer Wörter und Phrasen, die bei falscher Übersetzung ihre Bedeutung verlieren.</p> <h2>Zeilenumbruch-Eigenschaft</h2> <p>In HTML gibt es ein spezielles Tag zum Trennen von Zeilen <br>. Aber seine zu häufige Verwendung gilt unter Entwicklern als schlechtes Benehmen und weist oft auf Unprofessionalität hin. Stellen Sie sich als Beweis vor, Sie haben ein Logo und möchten, dass jeder Buchstabe in einer neuen Zeile beginnt:</p><p> <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Überprüfung der Umformulierung von Wörtern
| 