Beispielcode zum automatischen Umbrechen des Pre-Tags
|
Das Pre-Element definiert vorformatierten Text. In einem Pre-Element eingeschlossener Text behält normalerweise Leerzeichen und Zeilenumbrüche bei. Der Text wird auch in einer Monospace-Schriftart wiedergegeben. Eine häufige Anwendung des <pre>-Tags ist die Darstellung von Computerquellcode. Technische Blogs verwenden häufig das Pre-Tag, um Code auszugeben oder hervorzuheben. Standardmäßig wird der Inhalt im Pre-Tag nicht automatisch umbrochen, wenn er den Bereich überschreitet. Hier ist eine Methode, um den Inhalt im <pre>-Tag automatisch umzubrechen und den W3C-Standards zu entsprechen (von mehreren Browsern unterstützt). Code kopieren Der Code lautet wie folgt:vor{ Leerzeichen: Vorumbruch; /* css3.0 */ Leerzeichen: -moz-pre-wrap; /* Firefox */ Leerzeichen: -pre-wrap; /* Opera 4-6 */ Leerzeichen: -o-pre-wrap; /* Opera 7 */ Zeilenumbruch:Wortumbruch; /* Internet Explorer 5.5+ */ } Beispiel: Code kopieren Der Code lautet wie folgt:pre{white-space:pre-wrap; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word; /*Das ist ein sehr langer Code. Sehen Sie, dass ich den Code umbrochen habe, richtig? */} |
<<: Detaillierte Erläuterung gängiger Methoden von JavaScript Array
>>: Mehrere Möglichkeiten, „Textüberlaufkürzung und -auslassung“ mit reinem CSS zu implementieren
Artikel empfehlen
Detaillierte Erläuterung der Gründe für die Trennung von JS WebSocket und des Heartbeat-Mechanismus
1. Grund der Sperrung Es gibt viele Gründe, warum...
Erfahren Sie in einem Artikel, wie Sie mehrere Tomcats bereitstellen und starten und Projekte migrieren
Inhaltsverzeichnis Tomcat bereitstellen 1. Herunt...
Eine kurze Analyse von Kubernetes-Controllern und -Labels
Inhaltsverzeichnis 01 Gemeinsame Controller in k8...
So erstellen Sie YUM in einer Centos7-Umgebung
1. Geben Sie die Konfigurationsdatei der Yum-Quel...
So verwenden Sie Docker-Compsoe zum Bereitstellen eines Projekts mit Front-End- und Back-End-Trennung
Sag es im Voraus Wir alle wissen, dass Docker ein...
js kehrt zur vorherigen Seite zurück und aktualisiert den Code
1. Javascript kehrt zur vorherigen Seite zurück hi...
Tutorial-Diagramm zur Installation von CentOS 7.3 auf einer virtuellen VMware-Maschine
VMware-Vorbereitung CentOS-Vorbereitung, hier ist...
So installieren Sie MySQL 5.7 manuell auf CentOS 7.4
MySQL-Datenbanken werden häufig verwendet, insbes...
Der Unterschied zwischen Anzeige, Sichtbarkeit, Deckkraft, RGBA und Z-Index: -1 in CSS
Wir müssen oft die versteckten, transparenten und...
Einige kleine Methoden, die häufig in HTML-Seiten verwendet werden
Fügen Sie das Tag <Head> hinzu <meta http...
Ausführliche Erklärung dieses Schlüsselworts in JavaScript
Inhaltsverzeichnis 1. Einleitung 2. Verstehen Sie...
Tutorial zum Bereitstellen des Open-Source-Projekts Tcloud mit Docker auf CentOS8
1. Docker installieren 1. Ich habe Centos7 in der...
Detaillierte Erläuterung der Inline-Blocklayout-Implementierung des CSS-Anzeigeattributs
CSS-Anzeigeeigenschaft Hinweis: Wenn !DOCTYPE ang...
MySQL-Benutzerdefinierte Funktion zum Bestimmen, ob es sich um einen positiven Ganzzahl-Beispielcode handelt
Sie können eine Funktion schreiben: Verwenden Sie...
Warum wird in React nicht empfohlen, einen Index als Schlüssel zu verwenden?
1. Vergleichen Sie den alten virtuellen DOM mit d...