Eigenschaft float

Die Eigenschaft float - definiert schwebende Blöcke, die von Text umflossen werden. Die Eigenschaft float wird manchmal zusammen mit der Eigenschaft clear verwendet, welche das Umfließen des Elements aufhebt.

Obwohl float ursprünglich für das Einfügen von umflossenen Blöcken in Text erdacht wurde, wird es heutzutage sehr weit verbreitet und auf nicht standardisierte Weise für den Aufbau von Layouts verwendet.

Syntax

cssSelektor {
  float: left | right | none;
}
cssSelektor {
  clear: both | left | right | none;
}

Werte für float

Wert Beschreibung
left Der Block schwebt links, und der Text umfließt ihn rechts.
right Der Block schwebt rechts, und der Text umfließt ihn links.
none Kein Umfließen.

Standardwert: none.

Werte für clear

Wert Beschreibung
left Hebt das Umfließen von links auf.
right Hebt das Umfließen von rechts auf.
both Hebt das Umfließen sowohl von links als auch von rechts auf.
none Keine Aufhebung des Umfließens.

Standardwert: none.

Beispiel

Wir verwenden float auf nicht standardisierte Weise, indem wir die Listenelemente in einer Reihe anordnen:

html<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
</ul>
cssli {
  float: left;
  border: 1px solid red;
}

Результат:

Siehe auch

  • die Eigenschaft clear,
    die float für darüberliegende Elemente aufhebt