JavaScript

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 ($), …

Le variabili nei file CSS con Sass Leggi altro »

Compass: un tool di sviluppo per Sass

Compass è uno dei framework più utilizzati in combinazione con Sass per velocizzare lo sviluppo di file CSS Compass è un framework open-source molto utilizzato con Sass che consente di velocizzare e migliorare la qualità del codice scritto. Questo tool di sviluppo offre un gran numero di mixin già scritti, ad esempio background-image che consente …

Compass: un tool di sviluppo per Sass Leggi altro »

I mixin in Sass

Creare delle “funzioni” che accettano dei parametri in ingresso tramite in mixin in Sass I mixin consentono di creare gruppi di selettori e proprietà CSS in modo da poterli riutilizzare all’interno dei fogli di stile. In Sass è possibile applicare dei parametri arbitrari sui mixin, in maniera molto simile all’invocazione di una funzione. Definiamo un …

I mixin in Sass Leggi altro »

I cicli for, each e while in Sass

Iterare in Sass con le strutture dei cicli: for, each e while Sass consente di utilizzare i cicli in modo da iterare un blocco di istruzioni. Per poter iterare un numero finito di cicli esiste la direttiva @for che genera ripetutamente set di dichiarazioni in base al valore assunto da un contatore. La sintassi per …

I cicli for, each e while in Sass Leggi altro »

La direttiva if in Sass

Sass mette a disposizione delle direttive per effettuare delle condizioni e modificare il flusso di esecuzione. La direttiva @if consente di generare un blocco di funzionalità se l’espressione della condizione è diversa da false o null. Ad esempio:     @if $myColor == blue {         color: blue;         } @else if $myColor == red {             color: red;         } …

La direttiva if in Sass Leggi altro »

Le media query in Sass

Come utilizzare le media query in Sass con la direttiva @media Sass consente di generare nomi di selettori e proprietà dinamicamente tramite l’interpolazione. Con questa funzionalità, è possibile generare media query in modo più strutturato con le variabili. Ad esempio, definiamo due variabili:     $screen-size: 1920px;     $my-screen: “only screen and (max-width: #{$screen-size})”;