Le variabili nei file CSS con Sass

Sass consente di definire ed utilizzare delle variabili in cui memorizzare le informazioni migliorando la manutenzione del file CSS

Un grande vantaggio che offre Sass è l’opportunità di utilizzare delle variabili in cui memorizzare delle informazioni e utilizzarla in altre parti del codice. In Sass una variabile viene definita attraverso il simbolo del dollaro ($), ad esempio se vogliamo utilizzare il colore rosso in più punti possiamo salvare il codice esadecimale del colore in una variabile e utilizzarla variabile dove vogliamo:

    $my-color: #ff0000;

    p {
        color: $my-color;
    }

    div {
        color: $my-color;
    }

Dal punto di vista della manutenzione del CSS l’utilizzo di variabili per la generazione dei file CSS rappresenta un vantaggio non di poco conto, se un giorno decidessimo di modificare il colore impostato non dovremo più modificare il codice esadecimale in tutti i punti in cui è stato utilizzato ma ci basterà modificarlo solo nel punto in cui è stata definita la variabile. Alla generazione del file CSS la variabile verrà sostituito dal suo valore:

    p {
        color: #ff0000;
    }

    div {
        color: #ff0000;
    }

Ecco l’elenco delle lezioni su Sass:

Pubblicato in CSS, Front-end, JavaScript, Programmazione, Sass Taggato con: ,

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

*