animazioni-css | frontendfacile.it

30 settembre 2026

Animare <details> e <summary> in CSS: card “accordion” fluide, senza JavaScript

Usare <details> e <summary> per rivelare contenuti è una scelta elegante: accessibile, nativa e spesso sufficiente senza JavaScript. Con alcune proprietà CSS moderne puoi trasformare questo pattern in una micro‑interazione curata: apertura/chiusura fluida, transizione anche in chiusura (non scontata) e animazioni progressive sugli elementi interni. Vediamo come impostarlo in modo pulito, con progressive enhancement ragionato.

17 settembre 2026

Le unità CSS più usate “in produzione” non sono quelle che pensi

Quali unità CSS compaiono davvero più spesso sui siti reali? Oltre ai classici px, em e rem, nelle prime posizioni entrano unità che molti non associano subito alla “mise en page”: secondi e gradi. Un promemoria utile su dove le unità contano davvero e su come scegliere quelle giuste nel quotidiano.

27 agosto 2026

Underline “magico” in CSS con Anchor Positioning: l’effetto che prima era un incubo, ora sono poche righe

Creare un underline o un evidenziatore animato che “insegua” le voci di una nav era spesso un esercizio di pazienza: misure, offset, resize, layout che cambia. Con CSS Anchor Positioning puoi ancorare un pseudo-elemento a un elemento e farlo saltare automaticamente sull’ultimo anchor attivo (es. il link in hover/focus), con animazioni fluide e anche un tocco di blur/glass se vuoi.