Höhe - CSS-Tricks | CSS-Almanach 2025

Die heightin CSS definierte Eigenschaft gibt die Inhaltshöhe von Feldern an und akzeptiert alle Längenwerte.

Der Bereich „Inhalt“ wird zusätzlich zu der Höhe / Breite oder Größe, die der Inhalt selbst einnimmt, als Auffüllung und Rand definiert.

Negative Werte wie height: -100pxwerden nicht akzeptiert. Die heightEigenschaft gilt nicht für nicht ersetzte Inline-Elemente, einschließlich Tabellenspalten und Spaltengruppen.

.wrap ( height: auto; /* auto keyword */ height: 120px; /* length values */ height: 10em; height: 0; /* unit-less length is OK for zero */ height: 75%; /* percentage value */ height: inherit; /* inherited value from parent element */ )

Schauen Sie sich diesen Stift an!

Wenn die Höhe des enthaltenden Blocks nicht explizit angegeben wird und das Element nicht absolut positioniert ist, wird der Wert seiner Höhe auf auto berechnet (er ist so hoch wie der Inhalt darin oder Null, wenn kein Inhalt vorhanden ist). Wenn die Elemente Inhaltsteil mehr vertikalen Raum als verfügbar von dem Wert zugeordnet erfordert, wird das Verhalten durch die Elemente definierten overflowEigenschaft.

Wenn das Schlüsselwort auto, heightberechnet auf der Basis der Elemente Flächeninhalt , sofern nicht ausdrücklich angegeben ist . Dies bedeutet, dass ein auf einem Prozentsatz basierender Wert immer noch der des Inhaltsbereichs der Elemente ist. Wenn die Höhe des Containers auf einen Prozentwert festgelegt ist, basiert die prozentuale Höhe eines untergeordneten Elements weiterhin auf dem Inhaltsbereich dieses untergeordneten Elements.

Die Höhe kann auch als animierbare Eigenschaft verwendet werden.