Cerca articoli della Knowledge Base

Unità di misura CSS: px, em, rem, vw, vh

Unità di misura CSS: px, em, rem, vw, vh

Guida completa alle unità di misura in CSS.

Unità assolute

  • px - Pixel, fisso
  • pt - Punti (stampa)
  • cm, mm, in - Misure fisiche

Unità relative al font

/* em - relativo al font-size del genitore */
.child { font-size: 1.5em; } /* 150% del genitore */

/* rem - relativo al font-size del root (html) */
body { font-size: 1rem; } /* = 16px di default */

Unità viewport

.fullscreen {
 width: 100vw; /* 100% larghezza viewport */
 height: 100vh; /* 100% altezza viewport */
}

.responsive-text {
 font-size: 4vw; /* 4% della larghezza viewport */
}

Quando usare cosa

  • rem - Spaziature, font-size
  • px - Bordi, ombre
  • % - Larghezze fluide
  • vh/vw - Layout full-screen

Hai trovato utile quest'articolo?

Articoli Correlati

  • Introduzione al CSS

    Introduzione al CSS Il CSS (Cascading Style Sheets) è il linguaggio utilizzato per definire lo stile...

  • Selettori Css di Base

    Selettori Css di Base I selettori CSS permettono di identificare gli elementi HTML a cui applicare g...

  • Proprietà color e background

    Proprietà color e background Le proprietà color e background sono fondamentali per definire l'aspett...

  • Margin e Padding

    Margin e Padding Margin e Padding controllano lo spazio intorno e dentro gli elementi.Differenza chi...

  • Box Model CSS

    Box Model CSS Il Box Model è il concetto fondamentale che descrive come ogni elemento HTML è rappres...