Heim  >  Artikel  >  Web-Frontend  >  Einführung in die spezifische Verwendung des CSS-Wortumbruchattributs

Einführung in die spezifische Verwendung des CSS-Wortumbruchattributs

黄舟
黄舟Original
2017-06-20 10:56:172114Durchsuche

Bei der Verarbeitung von Text auf einer Webseite treten verschiedene Zeilenumbrüche auf. Unter welchen Umständen führen Seitenelemente Zeilenumbrüche aus? Wir können diesen Zeilenumbruch durch den Wortumbruch-Code präzise steuern.

Syntax:

word-break : normal | break-all | keep-all

Parameter:

normal: Gemäß den Textregeln asiatischer und nichtasiatischer Sprachen sind Zeilenumbrüche innerhalb von Wörtern zulässig
break -all : Dieses verhält sich genauso wie normal in asiatischen Sprachen. 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: Gleich 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

Beschreibung:

Legt das Umbruchverhalten des Texts innerhalb des -Objekts fest oder ruft dieses ab. Vor allem, wenn mehrere Sprachen auftauchen.
Für Chinesisch sollte Break-All verwendet werden.
Die entsprechende Skriptfunktion ist WordBreak. Bitte sehen Sie sich andere Bücher an, die ich geschrieben habe.

Beispiel:

div {word-break : break-all; }

Anwendungscode. Wir haben die Parameter für den Wortumbruch innerhalb des Testelements ermittelt.

p.test {word-break:hyphenate;}

Was die Browserunterstützung angeht, erfüllt Word-Break immer noch die Anforderungen sehr gut. Die meisten Browser unterstützen diesen Code.

So verwenden Sie Wortumbrüche. Sein Standardwert ist normal und seine Vererbung-Eigenschaft ist „Ja“ und seine Version ist CSS3

Java-Verwendung. object.style.wordBreak="keep-all"In dieser Java-Anweisung geben wir einen anderen Parameterwert an.

Die Syntax des Codes.

word-break: normal|break-all|keep-all;

In diesem Code gibt es drei verschiedene Situationen. „normal“ ist die Standardeinstellung des Browsers. Break-All ist ein Zeilenumbruch innerhalb eines Wortes. keep-all ist ein Leerzeichen oder Bindestrich halber Breite.

Stilprozess bieten wir den Lernenden zwei verschiedene Vergleichsmöglichkeiten. Gleichzeitig können wir auch sehen, dass gleichzeitig auch die Definition des äußeren Rahmens aktiviert ist.

<style> 
p.test1
{
width:13em; 
border:2px solid #000000;
word-break:hyphenate;
}

p.test2
{
width:13em; 
border:2px solid red;
word-break:break-all;
}
</style>

Das obige ist der detaillierte Inhalt vonEinführung in die spezifische Verwendung des CSS-Wortumbruchattributs. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn