CSS-Eigenschaft break-before

❮ Vorige Nächste ❯

Die CSS-Eigenschaft break-before definiert, wie sich ein Break (Seite, Spalte) vor der generierten Box verhalten soll. Wenn das generierte Box übersehen wird, wird die Eigenschaft ignoriert. Es hat vier Werte: auto, avoid, always, all.

Diese Eigenschaft ist veraltet.

Anfangswert	auto
Gilt für	Block-Eevel-Elemente
Geerbt	Nein
Animierbar	Diskret
Version	CSS3
DOM Syntax	object.style.breakBefore = "auto";

Syntax

break-before: auto | avoid | always | all | initial | inherit;

Beispiel

<!DOCTYPE html>
<html>
  <head>
    <title>Der Titel des Dokuments</title>
    <style>
      .multicol {
      background-color: #eee;
      padding: 10px;
      /* Safari and Chrome */
      -webkit-column-count: 3;
      -webkit-column-rule: 2px dotted #ccc;
      /* Firefox */
      -moz-column-count: 3; 
      -moz-column-rule: 2px dotted #ccc;
      /* CSS3 */
      column-count: 3; 
      column-rule: 2px dotted #ccc;
      }
      .multicol hr {
      break-before: column;
      }
    </style>
  </head>
  <body>
    <h2>Ein Beispiel für break-before example</h2>
    <div class="multicol">
      <h2>Lorem ipsum</h2>
      <p>Lorem Ipsum ist ein Blindtext der Druck- und Satzindustrie. Lorem Ipsum ist der Standard-Dummy-Text der Branche seit den 1500er Jahren, als ein unbekannter Drucker ein Setzschiff vom Typ nahm und es zu einem Musterbuch verarbeitete. Sie hat nicht nur fünf Jahrhunderte, sondern auch den Sprung in den elektronischen Satz ohne Wesentlichen Veränderungen überlebt. </p>
      <hr>
      <h2>Lorem ipsum</h2>
      <p>Lorem Ipsum ist ein Blindtext der Druck- und Satzindustrie. Lorem Ipsum ist der Standard-Dummy-Text der Branche seit den 1500er Jahren, als ein unbekannter Drucker ein Setzschiff vom Typ nahm und es zu einem Musterbuch verarbeitete. Sie hat nicht nur fünf Jahrhunderte, sondern auch den Sprung in den elektronischen Satz ohne Wesentlichen Veränderungen überlebt.</p>
    </div>
  </body>
</html>

Versuch es selber!

Werte

Wert	Beschreibung
auto	Es ermöglicht das Einfügen eines beliebigen Bereichs (Seite, Spalte) vor der Hauptbox.
avoid	Vermeidet es, einen Bruch vor der Hauptbox einzufügen.
always	Erzwingt das Einfügen eines Bruchs vor der Hauptbox.
all	Erzwingt das Einfügen eines Bruchs vor der Hauptbox.
initial	Es setzt die Eigenschaft auf seinen Standardwert.
inherit	Es erbt die Eigenschaft von seinem übergeordneten Element.