Nei precedenti script abbiamo introdotto il funzionamento, la differenza e il caso d'uso di Container Queries e Media Queries. Ora andiamo a utilizzare un template HTML che, per finalità di demo, resterà elementare, ma ci consentirà di apprezzare ogni singola modifica che verrà ...

Nello script #421 abbiamo introdotto le Container Queries e il loro ruolo nel produrre un layout responsivo[.b] sulla base della dimensione di un contenitore rispetto alla viewport.Un ulteriore vantaggio che troviamo nell'applicazione delle container queries è la possibilità di ...

Le Container Queries rappresentano una delle più importanti innovazioni nel mondo del CSS, offrendo una soluzione efficace per creare layout responsivi che si adattano alle dimensioni di un contenitore piuttosto che a quelle dell'intera viewport, come invece accade con le media ...

Siamo quasi giunti alla fine di questa mini guida per rendere il nostro template CSS un po' più nostro. All'appello non dimentichiamo però il menù in cima alla pagina che, insieme al logo, è uno degli strumenti più importanti in un layout web dato che accompagnerà l'utente per ...

Come abbiamo già visto in script precedenti, le immagini sono da sempre elementi ostici da gestire. Per la nostra libreria ci affideremo alle classi fornite dal framework CSS prescelto ed andremo solo ad aggiungere una punta di interattività.Possiamo riutilizzare gli effetti di ...

Il problema principale nell'utilizzo delle card è la quantità di informazioni che possiamo inserire al loro interno: mai abbastanza.Se osserviamo i vari template disponibili troviamo sempre delle rappresentazioni in cui il titolo è spesso Questo è un titolo e descrizioni Questa è...

Similmente a quanto abbiamo visto fino ad ora, con l'elemento button possiamo creare, per il nostro tema/framework CSS, degli stili per le cards. Abbinando diverse proprietà possiamo ottenere buoni effetti di tridimensionalità o di colori, che renderanno la pagina di sicuro più ...

Il Clip-path è una proprietà CSS rilasciata nel 2016. Perché, pur essendo disponibile da così tanto tempo, non ne sentiamo mai parlare e, soprattutto, a cosa potrebbe servirci per la nostra libreria CSS?Lo scopo del Clip-path è semplice: crea una forma geometrica all'interno dell...

Quante volte ci è capitato di scegliere un tema/framework CSS ripetto ad un altro, solamente perchè alla prima demo notiamo effetti scenici mozzafiato, con transizioni di elementi, hover, cambi di colore, e così via? E quante volte poi, ci siamo sentiti dire "Il cliente conosce ...

Negli scorsi script abbiamo fatto chiarezza su come, per un layer, sia impossibile referenziare un layer con scope più elevato. Ma come avviene per inherit, abbiamo la keyword revert-layer, che ci permette di reimpostare il valore della regola CSS al layer precedente.@layer ...