height

Übersicht

Die height Eigenschaft legt die Höhe des Inhaltsbereichs (content area) eines Elements fest.
Der Inhaltsbereich befindet sich innerhalb des Rahmenbereiches sowie innerhalb der Innenabstands- und Außenabstandsbereichen, sodass das Element insgesamt (mit border, padding und margin ) mehr Platz benötigen könnte bzw. größer sein kann.

  • Standardwert auto
  • Anwendbar auf all Elemente but non-replaced inline Elemente, table columns, undcolumn groups
  • Vererbt Nein
  • Prozentwerte The percentage is calculated with respect to the height of the generated box's containing block. If the height of the containing block is not specified explicitly (i.e., it depends on content height), and this element is not absolutely positioned, the value computes to auto. A percentage height on the root element is relative to the initial containing block.
  • Medium visuell
  • Berechneter Wert a percentage oder auto oder the absolute length
  • Animierbar Ja, als Längenangabe, Prozentsatz oder max-width
  • Canonical order the unique non-ambiguous order defined by the formal grammar

Syntax

height: auto | <length> | <percentage>

Werte

auto
Standardwert. Die Höhe wird automatisch berechnet.
<Längenangabe>
Eine Längenangabe für die Höhe des Elements.
<Prozentzahl>
Eine prozentuale Angabe, die sich auf den umschließenden Block bezieht. Die Prozentangabe kann nur berücksichtigt werden, wenn die Höhe des umschließenden Blocks festgelegt wurde, andernfalls wird die definierte Prozentzahl wie auto behandelt. Eine prozentuale Höhenangabe im Wurzelelement (z.B. <html>) bezieht sich auf den Darstellungsbereich (viewport).
inherit
Der Wert des Elternelements wird geerbt.

Beispiele

img { height: 200px; }

form { height: auto; }

table { height: 100%; }

/* Damit Prozentwerte angewendet werden können, muss sichergestellt sein, dass der umschließende Block eine Höhe hat. */
html, body { margin: 0; height: 100%; }

Hinweise

Die min-height und max-height Eigenschaften überschreiben die height Eigenschaft.

Spezifikation

Spezifikation Status Anmerkung
CSS Basic Box Model Working Draft Die Werte max-content, min-content, available, fit-content, border-box und content-box hinzugefügt
CSS Transitions Working Draft height sit annimierbar
CSS Level 2 (Revision 1) Recommendation <length> hinzugefügt
CSS Level 1 Recommendation Standartwert definiert

Browser Kompatibilität

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 1.0 1.0 (1.7 or earlier) 4.0 7.0 1.0
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support 1.0 1.0 (1) 6.0 6.0 1.0

 

Siehe auch

Schlagwörter des Dokuments und Mitwirkende

Schlagwörter:
Mitwirkende an dieser Seite: SJW, fscholz, Michael2402, Jürgen Jeka
Zuletzt aktualisiert von: SJW,
Seitenleiste ausblenden