Una delle funzionalità più interessanti offerte da LESS è quella di effettuare dei calcoli. In questo script vedremo come questa funzionalità può essere utilizzata a nostro vantaggio.
Supponiamo di avere due tag DIV e che il secondo div debba essere largo esattamente il doppio del primo. Quello che possiamo fare con LESS è dichiarare una variabile che rappresenti la dimensione del primo DIV e poi nel secondo DIV assegnare la larghezza moltiplicando per due la variabile creata in precedenza. Nel prossimo snippet possiamo vedere come realizzare quanto appena esposto.
@baseWidth: 30%; .div1 { width: @baseWidth; } .div2 { width: @baseWidth * 2; }
Il vantaggio di questa tecnica consiste nel fatto che se abbiamo molti DIV da mantenere in proporzione e in seguito decidiamo di cambiare la dimensione del DIV di base, ci basta cambiare solo il valore della variabile baseWidth lasciando inalterato il resto del file.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Popolare una classe a partire dal testo, con Semantic Kernel e ASP.NET Core Web API
Eseguire un metodo asincrono dopo il set di una proprietà in Blazor 8
Effettuare il binding di date in Blazor
Ottimizzare la latenza in Blazor 8 tramite InteractiveAuto render mode
Usare una container image come runner di GitHub Actions
Utilizzare il nuovo modello GPT-4o con Azure OpenAI
Creare una libreria CSS universale: Cards
Creazione di plugin per Tailwind CSS: espandere le funzionalità del framework dinamicamente
Eseguire query per recuperare il padre di un record che sfrutta il tipo HierarchyID in Entity Framework
Gestire i dati con Azure Cosmos DB Data Explorer
Installare le Web App site extension tramite una pipeline di Azure DevOps
Creazione di plugin per Tailwind CSS: espandere le Funzionalità del Framework