Nello script #82 abbiamo vosto come creare uno stile (o mixin) e poi riutilizzarlo all'interno di altri stili. In quello script abbiamo utilizzato delle proprietà CSS statiche, ma con LESS possiamo creare anche mixin parametrici ovvero dove i valori delle proprietà CSS è deciso dall'utilizzatore del mixin.
Per fare questo dobbiamo dichiarare i parametri di input del mixin circondandoli con parentesi tonde ('(' e ')') e dividendoli con un punto e virgola ';'. Chi utilizza il mixin deve passare i parametri sempre circondandoli con parentesi tonde e separandoli con punto e virgola. Per fare un esempio pratico, se vogliamo impostare margin e padding a valori differenti per i tag HTML header e footer possiamo fare una cosa del genere:
.margins(@margin; @padding) {
margin: @margin;
padding: @padding;
}
header {
.margins(5px; 10px);
}
footer {
.margins(2px; 5px);
}
Il CSS prodotto da questo script LESS è il seguente:
header {
margin: 5px;
padding: 10px;
}
footer {
margin: 2px;
padding: 5px;
}Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Utilizzare WhenEach per processare i risultati di una lista di task
Rendere le variabili read-only in una pipeline di Azure DevOps
Utilizzare i variable font nel CSS
Gestione delle scrollbar dinamiche in HTML e CSS
Ricevere notifiche sui test con Azure Load Testing
Abilitare .NET 10 su Azure App Service e Azure Functions
Utilizzare l'espressione if inline in una pipeline di Azure DevOps
Usare la libreria PredicateBuilder per eseguire query tramite Entity Framework che usano or su più campi
Configurare lo startup di applicazioni server e client con .NET Aspire
Definire il colore di una scrollbar HTML tramite CSS
I più letti di oggi
- Inserire le news di Punto Informatico nel proprio sito
- Effettuare il multi-checkout in linea nelle pipeline di Azure DevOps
- Esaminare documenti XML con namespace utilizzando LINQ to XML
- Sfruttare una CDN con i bundle di ASP.NET
- Alleggerire le applicazioni WPF sfruttando gli oggetti Freezable
- Le DirectInk API nella Universal Windows Platform
- Effetto turnstile su tutte le pagine con il Windows Phone Toolkit
- Gli oggetti CallOut di Expression Blend 4.0


