Una variabile CSS viene definita sempre all'interno di un selettore CSS sia questo relativo una classe o a un oggetto. Il punto migliore per definire le variabili utili in tutto il foglio di stile è sicurametne il seletore html. Questo perchè le variabili CSS vengono automaticamente ereditate dai selettori di più alto livello quindi essendo il tag HTML il più alto nella gerarchia del DOM, tutti i nodi figli vedono le variabili definite nel selettore. All'occorrenza, i selettori figli possono anche ridefinire le variabili ereditate. Prendiamo il seguente esempio.
.parent { --myvar: 10px; } .child { --myvar: 20px; }
<div class="parent"> <div class="child"></div> <div></div> </div>
In questo esempio, il tag DIV con classe CSS parent ha la variabile myvar che esprime un valore di 10px; il tag DIV interno con classe child ha la variabile myvar con valore 20px; il tag DIV interno senza classe ha la variabile myvar con valore 10px perchè ereditata dal padre.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Registrare servizi multipli tramite chiavi in ASP.NET Core 8
Gestire domini wildcard in Azure Container Apps
Definire stili a livello di libreria in Angular
Esportare ed analizzare le issue di GitHub con la CLI e GraphQL
Effettuare chiamate con versioning da Blazor ad ASP.NET Core
Eseguire operazioni con timeout in React
Eseguire le GitHub Actions offline
Accesso sicuro ai secrets attraverso i file in Azure Container Apps
Personalizzare l'errore del rate limiting middleware in ASP.NET Core
Utilizzare Tailwind CSS all'interno di React: primi componenti
Utilizzare il trigger SQL con le Azure Function
Usare Refit e Polly in Blazor per creare client affidabili e fortemente tipizzati
I più letti di oggi
- Utilizzare WebAssembly con .NET, ovunque
- Definire stili a livello di libreria in Angular
- ecco tutte le novità pubblicate sui nostri siti questa settimana: https://aspit.co/wkly buon week-end!
- Ottimizzare le performance delle collection con le classi FrozenSet e FrozenDictionary
- Utilizzare il trigger SQL con le Azure Function
- Ottimizzazione dei block template in Angular 17
- Disabilitare automaticamente un workflow di GitHub (parte 2)