CSS line-break-Eigenschaft

Die line-break-Eigenschaft legt fest, wie Zeilenumbrüche bei chinesischen, japanischen oder koreanischen (CJK) Texten im Zusammenhang mit Interpunktion und Symbolen behandelt werden. Da diese Sprachen unterschiedlichen typografischen Regeln folgen, treten Zeilenumbrüche nicht immer an den erwarteten Stellen auf. Wenn beispielsweise auf strict gesetzt, sind Zeilenumbrüche nur an bestimmten Stellen erlaubt, wie etwa nach bestimmten Interpunktionszeichen, und nicht vor Bindestrichen oder beliebigen Zeichen. Die CSS-Spezifikation definiert spezifische Regeln für chinesische, japanische und koreanische (CJK) Texte.

Anfangswert	auto
Gilt für	Alle Elemente, jedoch nur bei Blockcontainern.
Vererbt	Ja.
Animierbar	Nein.
Version	CSS3
DOM-Syntax	object.style.lineBreak = "loose";

Syntax

Syntax der CSS line-break-Eigenschaft

css

line-break: auto | loose | normal | strict | initial | inherit;

Beispiel für die line-break-Eigenschaft:

Beispiel der CSS line-break-Eigenschaft mit dem Wert strict

html

<!DOCTYPE html>
<html>
  <head>
    <style>
      .korean {
        line-break: strict;
      }
    </style>
  </head>
  <body>
    <h2>Line-break property example</h2>
    <!--Be the change you want to see in the world.-->
    <span class="korean">세상에서 보고싶은 변화가 있다면 당신 스스로 그 변화가 되어라.</span>
  </body>
</html>

Try it Yourself »

Ergebnis

CSS line-break Property

Beispiel für die line-break-Eigenschaft mit dem Wert „normal“:

Beispiel der CSS line-break-Eigenschaft mit dem Wert normal

html

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      p {
        font-size: 16px;
        line-height: 24px;
        line-break: normal;
      }
    </style>
  </head>
  <body>
    <h2>Line-break property example</h2>
    <p>日本語のテキスト例です。行の折り返し位置を確認します。日本語のテキスト例です。行の折り返し位置を確認します。日本語のテキスト例です。行の折り返し位置を確認します。</p>
  </body>
</html>

Try it Yourself »

Werte

Wert	Beschreibung
auto	Unterbricht den Text gemäß der Standard-Zeilenumbruchregel. Dies ist der Anfangswert der Eigenschaft.
normal	Unterbricht den Text gemäß den am wenigsten einschränkenden Zeilenumbruchregeln.
loose	Unterbricht den Text gemäß den gängigsten Zeilenumbruchregeln.
strict	Unterbricht den Text gemäß den am strengsten einschränkenden Zeilenumbruchregeln.
initial	Setzt die Eigenschaft auf ihren Standardwert zurück.
inherit	Erbt die Eigenschaft vom übergeordneten Element.

Practice

Welche der folgenden Methoden kann verwendet werden, um einen Zeilenumbruch in CSS einzufügen?

<br> kann verwendet werden, um einen Zeilenumbruch einzufügen.white-space: pre; kann verwendet werden, um einen Zeilenumbruch einzufügen.Die clear-Eigenschaft kann verwendet werden, um einen Zeilenumbruch einzufügen.Die line-break-Eigenschaft kann verwendet werden, um einen Zeilenumbruch einzufügen.

CSS line-break-Eigenschaft ​

Syntax ​

Beispiel für die line-break-Eigenschaft: ​

Ergebnis ​

Beispiel für die line-break-Eigenschaft mit dem Wert „normal“: ​

Werte ​