Heim >Web-Frontend >HTML-Tutorial >Wie kann ich den Pre-Tag-Wrap automatisch durchführen?
Der Inhalt im Tag 3b4ad93ea36080674ba857c5f6b82730 wird automatisch umbrochen und entspricht den W3C-Standards (Unterstützung für mehrere Browser).
Standardmäßig wird der Inhalt im Tag 3b4ad93ea36080674ba857c5f6b82730 Wenn der Zeilenumbruch den Bereich überschreitet, erfolgt automatisch ein Zeilenumbruch, was zu Problemen beim Anzeigen oder Drucken führen kann.
Das Folgende stellt Code im CSS-Stil bereit, der den W3C-Standards entspricht und mehrere Browser unterstützt:
pre{white-space:pre-wrap; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word; }
Das Pre-Tag behält das Format des HTML-Inhalts unverändert bei, jedoch mit der gleichen Breite Wenn die Seite zu groß ist, wird sie unterbrochen. Zur Abhilfe ist ein automatischer Zeilenumbruch erforderlich:
Wrapping the pre tagMaking preformated text wrap in CSS3, Mozilla, Opera and IEis the tip that let's you use the pre tag to keep the formatting, without cursing yourself when some of the content is too long and doesn't wrap: pre {white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word; }
Fügen Sie am besten ein DIV zum übergeordneten Tag hinzu und legen Sie das CSS-Attribut fest 🎜>: Zeilenumbruch: Zeilenumbruch; Leerzeichen: normal; Stilschrift direkt verwenden:
<pre style="width:30px;word-break: break-all; word-wrap:break-word;border:1px solid #555"> asfasdfas dfasd fa sdfasdfDer vorformatierte Ausgabecode wird im Artikel verwendet. Standardmäßig erzwingt der Browser, dass der Inhalt in pre ohne Zeilenumbrüche ausgegeben wird. In diesem Fall wird es so aussehen, als würde sich der Code mit zunehmender Größe über die Seite hinaus erstrecken. Vorher habe ich absichtlich Zeilenumbrüche im Code erzwungen ... Ich bin müde. Heute habe ich absichtlich gegoogelt und Folgendes gefunden:
pre { white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap;word-wrap: break-word;}Nach dem Testen, außer IE [verwendet derzeit 6], andere Okay. .. Ich war deprimiert und habe dann width:600px; hinzugefügt und dann, ok, die Zeile wurde geändert, aber die Position wurde tatsächlich abgeleitet. Es sieht so aus: Der Code ist drin, aber die Erzählung darunter ist raus. Mit anderen Worten, die Definition dieser Breite ist keine gute Methode. Es gibt grundsätzlich keine anderen Methoden, die das CSS nicht direkt ändern. Dann habe ich mir das CSS oben angesehen und dachte: Warum verwende ich Leerzeichen, wenn ich andere Dinge definiere, aber nicht, wenn ich IE definiere? Es ist nicht so, dass IE es nicht unterstützt. . Also füge es einfach hinzu [Ich habe die ersten 5 Seiten von Google durchgesehen und konnte keine Lösung finden, die durch eine CSS-Änderung gelöst werden könnte...].
pre { white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap;white-space: -o-pre-wrap;word-wrap: break-word; white-space : normal ; }Was den auf dieser Website verwendeten betrifft, ist IE von anderen getrennt, da sich Leerzeichen letztendlich auch auf andere auswirken....
Das obige ist der detaillierte Inhalt vonWie kann ich den Pre-Tag-Wrap automatisch durchführen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!