Display#

Die Eigenschaft display legt das Verhalten der Darstellung von Elementen innerhalb einer Website fest.

Eigenschaftswert	Erklärung
block	block lässt Elemente als ein block-Element darstellen. Sie erzeugen einen Zeilenumbruch und nehmen den gesamten Platz der Seite ein.
inline	Durch inline verhalten sich Elemente wie inline-Elemente, die nur den Platz einnehmen, den sie benötigen und sie erzeugen keinen Zeilenumbruch. Häufig haben die Eigenschaften width und height keine Auswirkung auf inline-Elemente wie zum Beispiel bei a oder span.
inline-block	inline-block-Elemente verhalten sich wie inline-Elemente und gleichzeitig wie block-Elemente. Dadurch können width und height angewendet werden.
none	Der Eigenschaftswert none lässt ein Element aus der Seite unsichtbar werden und der benötigte Platz wird freigegeben.
flex	Das Element wird als ein Flexbox-Element dargestellt. Siehe Flexbox.
grid	Das Element wird als ein Grid-Element dargestellt. Siehe CSS Grid.

img {
  display: block;
}

ul li {
  display: inline;
}

a {
  display: inline-block;
  background-color: aqua;
  height: 100px;
}

.box {
  display: none;
}

See the Pen display by csswebsite (@csswebsite) on CodePen.