So lösen Sie mit CSS das Problem des automatischen Zeilenumbruchs bei englischen Wörtern

Verhindern Sie, dass Tabellen/Ebenen platzen und Wörter kaputt gehen

Man kann sagen, dass das Problem des automatischen Zeilenumbruchs bei englischen Wörtern viele Menschen gequält hat. Wenn ein Wort über einen längeren Zeitraum geschrieben wird, wird die Tabelle unterbrochen, aber wenn es ignoriert wird, werden die englischen Wörter aufgeteilt.

Verhindern Sie, dass das Formular platzt

Dieses Problem wurde von vielen Leuten erwähnt und ich habe es später in der frühen Version gelöst, aber es führte dazu, dass die englischen Wörter aufgebrochen und in neue Zeilen umgebrochen wurden, sodass ich bei der Erstellung der neuen Vorlage keinen CSS-Code hinzugefügt habe um dies zu kontrollieren. Ich habe es heute ausprobiert und festgestellt, dass die Lösung sehr einfach ist.

Laut den meisten Artikeln im Internet fügen Sie einfach Folgendes hinzu:
Code
...........

Tisch {

Tabellenlayout:fixed;word-break:break-all;word-wrap:break-word;}

div{word-break:break-all;word-wrap:break-word;}

Dies kann das Problem defekter Tabellen und Ebenen lösen. Dies habe ich zunächst getan. Ein solcher Code stellt jedoch ein Problem dar. Sie werden feststellen, dass alle englischen Wörter abgeschnitten sind, was nicht den englischen Schreibgewohnheiten entspricht und dem Lesen nicht förderlich ist.

Später stellte ich fest, dass ich durch das Umschreiben des obigen Codes verhindern konnte, dass sowohl Tabellen/Ebenen als auch Wörter beschädigt werden.
wie folgt:
Code

Tisch {
Tabellenlayout: fest;
Zeilenumbruch:Wortumbruch;
}
div {
Zeilenumbruch:Wortumbruch;
}

Dies ist auch der Code, den ich jetzt verwende.
-------------------------------------------------- ---

Gemäß dem chinesischen CSS2-Handbuch von Rainer Su

Wortumbruchversion: IE5+ proprietäre Eigenschaftenvererbung: ja Syntax:
Wort-Break: normal |. break-all |
Wert:
normal: Standardwert. Erlauben Sie Zeilenumbrüche zwischen Wörtern
break-all: Dieses Verhalten ist das gleiche wie bei asiatischen Sprachen üblich. Pausen innerhalb eines beliebigen Wortes einer Textzeile in einer nicht-asiatischen Sprache sind ebenfalls zulässig. Dieser Wert eignet sich für asiatischen Text, der nicht-asiatischen Text enthält
keep-all: Dasselbe wie normal für alle nicht-asiatischen Sprachen. Für Chinesisch, Koreanisch und Japanisch sind Wortumbrüche nicht zulässig. Geeignet für nicht-asiatischen Text, der eine kleine Menge asiatischen Text enthält

veranschaulichen:
Legt das Intraword-Umbruchverhalten für Text innerhalb eines Objekts fest oder ruft es ab. Vor allem, wenn mehrere Sprachen auftauchen.
Für Chinesisch sollte Break-All verwendet werden.
Diese Eigenschaft ist für das currentStyle-Objekt schreibgeschützt. Es ist für andere Objekte lesbar und beschreibbar.
Die entsprechende Skriptfunktion ist wordBreak.
Beispiel:
div {word-break : break-all }
Gilt für:
IE5.0+

Zeilenumbruch-Version: IE5.5+ Vererbung proprietärer Eigenschaften: ja Syntax:
Zeilenumbruch: normal |
Wert:
normal: Standardwert. Erlauben Sie, dass sich der Inhalt über die angegebenen Containergrenzen hinaus erstreckt
break-word: Der Inhalt wird innerhalb der Grenzen unterbrochen. Bei Bedarf erfolgt auch ein Wortumbruch

veranschaulichen:
Legt fest oder ruft ab, ob die Zeile unterbrochen werden soll, wenn die aktuelle Zeile die Grenze des angegebenen Containers überschreitet.
Diese Eigenschaft funktioniert nur bei Layoutobjekten, z. B. Blockobjekten. Um dieses Attribut für Inline-Elemente zu verwenden, müssen Sie zunächst das Höhen- oder Breitenattribut des Objekts festlegen oder das Positionsattribut auf „absolut“ oder das Anzeigeattribut auf „Block“ festlegen.
Diese Eigenschaft ist für das currentStyle-Objekt schreibgeschützt. Es ist für andere Objekte lesbar und beschreibbar.
Die entsprechende Skriptfunktion ist WordWrap.
Beispiel:
div { Zeilenumbruch: Break-Wort; Word-Break: Break-All }

Achten Sie darauf
break-word: Der Inhalt wird innerhalb der Grenzen unterbrochen. Bei Bedarf erfolgt auch ein Wortumbruch

Standardmäßig werden Wörter nicht in neue Zeilen umgebrochen. Wenn es jedoch ein sehr langes Wort gibt, beispielsweise die falsche Version der 12 gruseligsten englischen Wörter in der Geschichte, werden auch Zeilen umgebrochen verhindert, dass das Formular beschädigt wird.
Dies wird jedoch von w3c nicht als CSS2-Standard übernommen, sodass Mozilla dieses Attribut nicht unterstützt. Wenn jeder englische Wörter gut schreibt, teilt Firefox sie nicht in neue Zeilen auf Wort, Mozilla Firefox wird die Zeile nicht unterbrechen und sie wird unterbrechen.
Ich weiß nicht, ob CSS3 dieses Attribut akzeptiert, aber um ehrlich zu sein, sind Wörter, die zu BT sind, besser ...