Was ist 100vh in CSS?

In CSS bezieht sich „100vh“ auf einen relativen Längenwert mit einer Größe von „100“ und die Einheit ist „vh“; „vh“ ist eine relative Längeneinheit in CSS, die relativ zur Höhe des Fensters ist. „100vh“ bedeutet, dass die Höhe des Elements der Höhe des Ansichtsfensters des aktuellen Browsers entspricht, dh der Höhe des sichtbaren Bereichs im Browser.

Die Betriebsumgebung dieses Tutorials: Windows 10-System, CSS3- und HTML5-Version, Dell G3-Computer.

Was ist 100vh in CSS?

vh ist eine relative Längeneinheit in CSS. Das Fenster wird in 100 Einheiten von vh unterteilt, d. h. 1vh entspricht immer einem Prozent der Höhe des aktuellen Fensters.

Das Fenster ist gleichmäßig in 100 vh-Einheiten unterteilt. Der Vorteil von vh besteht darin, dass die Höhe direkt ermittelt werden kann, die Verwendung von % jedoch die Höhe des visuellen Bereichs nicht korrekt ermitteln kann, ohne die Körpergröße festzulegen.

Der Ansichtsbereich bezieht sich auf die Größe des sichtbaren Bereichs im Browser, dh auf die Größe von window.innerWidth/window.innerHeight, mit Ausnahme der Größe des Browserbereichs der Titelleiste der Taskleiste und der unteren Symbolleiste.

Daher entspricht 100vh der Höhe des aktuellen Browserfensters, also der Höhe des sichtbaren Bereichs im Browser.

Höhe einstellen: 100vh, unabhängig davon, ob das Element keinen Inhalt hat, wird das Element auf die gleiche Höhe wie der Bildschirm gestreckt.

Erweitertes Wissen:

• vh: relativ zur Höhe des Fenster, das Fenster ist gleichmäßig in vh von 100 Einheiten unterteilt;

• vw: relativ zur Breite des Fensters, das Fenster ist in vw von 100 Einheiten unterteilt;

• vmax: relativ zur Breite oder Höhe von das Fenster, je nachdem, welches größer ist. Der größte ist in vmax von 100 Einheiten unterteilt;

• vmin: Der kleinere im Verhältnis zur Breite oder Höhe des Ansichtsfensters. Die kleinste ist zu gleichen Teilen in 100 vmin-Einheiten unterteilt

Das obige ist der detaillierte Inhalt vonWas ist 100vh in CSS?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!