Cerca articoli della Knowledge Base

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

    Il CSS (Cascading Style Sheets) è il linguaggio utilizzato per definire lo stile e la presentazione ...

  • Selettori CSS di base

    I selettori CSS permettono di identificare gli elementi HTML a cui applicare gli stili.Tipi di selet...

  • Proprietà color e background

    Le proprietà color e background sono fondamentali per definire l'aspetto visivo degli elementi.Propr...

  • Margin e Padding

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

  • Box Model CSS

    Il Box Model è il concetto fondamentale che descrive come ogni elemento HTML è rappresentato come un...