Nel CSS, le percentuali sono spesso utilizzate per definire le dimensioni degli elementi in base alla dimensione del loro contenitore genitore. Questo può essere molto utile per creare design responsivi che si adattano a differenti dimensioni dello schermo.
Ecco un esempio di come utilizzare le percentuali nei CSS:
```
div {
width: 50%; /* L’elemento sarà largo la metà del suo contenitore genitore */
padding: 5%; /* Il padding sarà il 5% della larghezza del suo contenitore genitore */
}
```
Questo codice CSS renderà il `
Ecco un altro esempio in cui viene utilizzata la percentuale per definire l’alto di un elemento:
```
div {
height: 75%; /* L’elemento sarà alto il 75% del suo contenitore genitore */
}
```
Questo codice CSS renderà l’elemento `
Si noti che per far funzionare correttamente le percentuali per la proprietà “height”, il genitore deve avere una altezza definita o può essere impostata alla proprietà di altezza del viewport utilizzando “vh”.
```
div {
height: 50vh; /* L’elemento sarà alto il 50% dell’altezza del viewport */
}
```