So verwenden Sie die neue Längeneinheit in CSS3

WBOY
Freigeben: 2022-01-24 11:47:49
Original
2397 Leute haben es durchsucht

Verwendung: 1. em stellt die Schriftgröße relativ zum Text im aktuellen Objekt dar; 3. ch stellt die Größe der Zahl 0 dar; 5. vw stellt die Breite des Ansichtsfensters in Prozent dar. 6. ex stellt die Höhe des Kleinbuchstabens x der aktuellen Schriftart oder 1/2 von 1em dar.

So verwenden Sie die neue Längeneinheit in CSS3

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

So verwenden Sie die neuen Längeneinheiten in CSS3

Die neuen Längeneinheiten in CSS3 sind:

  • em: die Schriftgröße relativ zum Text im aktuellen Objekt. Schriftgröße relativ zum übergeordneten Knoten

  • rem: Schriftgröße relativ zum Stammelement . Anwendungsszenario: Das Layout wird durch den Textinhalt bestimmt.

  • vh und vv: 1vh entspricht 1/100 der Ansichtsfensterhöhe ① und 1vw entspricht 1/100 der Ansichtsfensterbreite.

  • vmin und vmax: In Bezug auf den minimalen oder maximalen Wert der Höhe und Breite des Ansichtsfensters entspricht vmin dem Mindestwert von 1/100 der Breite und Höhe des Ansichtsfensters. Anwendungsszenario: Ein Element immer auf dem Bildschirm sichtbar machen.

  • ch: die Breite der Zahl 0

  • ex: die Höhe des Kleinbuchstabens x Buchstaben der aktuellen Schriftart oder 1/2 von 1em②. Anwendungsszenario: Hochgestellt und tiefgestellt

ch – die Breite des Zeichens 0 (Null)

rem – die Schriftgröße des Stammelements (HTML-Element)

Was bedeutet das?

Wenn beispielsweise die Schriftgröße des Stammelement-HTML 100 Pixel beträgt, sind die REM-Einstellungen der Elemente unter dem Stammelement alle 1rem = 100 Pixel.

Der Anfangswert von rem ist 16px, was bedeutet, dass 1rem = 16px ist, wenn die Schriftgröße des Stammknotens nicht festgelegt ist.

Denken Sie daran, dass dies relativ zum Stammelement-HTML ist Funktioniert nicht

Denken Sie daran: vw und vh beziehen sich nur auf den sichtbaren Bereich des Browsers, d sichtbarer Bereich

vh – der visuelle Bereich des Browsers, 1vh entspricht 1 % der Höhe des sichtbaren Bereichs des Browsers

vmin – der kleinere von vw und vh

vmax – der größere von vw und vh

B. die Breiten-/Höheneinstellungen des Browsers für 1000 Pixel/600 Pixel

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die neue Längeneinheit in CSS3. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
css
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!