MENO - Passaggio di set di regole a Mixin
Descrizione
Il set di regole separato contiene set di regole come proprietà, set di regole nidificati, dichiarazione di variabili, mixin, ecc. È memorizzato in una variabile e incluso in un'altra struttura; tutte le proprietà del set di regole vengono copiate in quella struttura.
Esempio
L'esempio seguente mostra come passare un set di regole da mixare nel file LESS -
passando_ruleset.htm
<!doctype html>
<head>
<link rel = "stylesheet" href = "style.css" type = "text/css" />
</head>
<body>
<div class = "cont">
<h2>Welcome to TutorialsPoint</h2>
<p>The largest Tutorials Library on the web.</p>
</div>
</body>
</html>
Quindi, crea il file style.less .
style.less
@detached-ruleset: {
.mixin() {
font-family: "Comic Sans MS";
background-color: #AA86EE;
}
};
.cont {
@detached-ruleset();
.mixin();
}
È possibile compilare il file style.less in style.css utilizzando il seguente comando:
lessc style.less style.css
Esegui il comando precedente; creerà automaticamente il file style.css con il seguente codice -
style.css
.cont {
font-family: "Comic Sans MS";
background-color: #AA86EE;
}
Produzione
Segui questi passaggi per vedere come funziona il codice sopra:
Salva il codice html sopra nel file passing_ruleset.htm file.
Apri questo file HTML in un browser, verrà visualizzato il seguente output.
Scoping
Tutte le variabili e i mixin nel set di regole separato sono disponibili ovunque il set di regole venga chiamato o definito. In caso contrario, per impostazione predefinita sono disponibili sia il chiamante che gli ambiti di definizione. L'ambito della dichiarazione ha la priorità quando entrambi gli ambiti contengono lo stesso mixin o variabile. Il corpo del set di regole separato è definito nell'ambito della dichiarazione. Non cambia il suo ambito dopo che il set di regole scollegato è stato copiato da una variabile a un'altra.
La tabella seguente elenca tutti i tipi di ambito:
Sr.No. | Tipi e descrizione |
---|---|
1 | Definizione e visibilità dell'ambito del chiamante Variabili e mixin sono definiti all'interno del set di regole separato. |
2 | Il riferimento non modifica l'ambito del set di regole scollegato Fornendo solo i riferimenti, il set di regole non accede a nessun nuovo ambito. |
3 | Lo sblocco modificherà l'ambito del set di regole scollegato Il set di regole scollegato può accedere all'ambito venendo importato in esso. |