Scopri gli strumenti e le tecniche di Chrome per migliorare il CSS e la progettazione dell'interfaccia utente del tuo sito.

Migliora le tue capacità di sviluppo dell'interfaccia utente

Utilizza le proprietà scrollbar-width e scrollbar-color per definire lo stile delle barre di scorrimento.
In CSS arriva una classica tecnica tipografica che prevede la creazione manuale di interruzioni di riga per blocchi di testo bilanciati.
CSS Color 4 offre sul Web strumenti e funzionalità per i colori con un'ampia gamma di colori: più colori, funzioni di manipolazione e gradienti migliori.
Il modello a oggetti tipo CSS (OM typed) consente di utilizzare tipi, metodi e un modello a oggetti flessibile per lavorare con i valori CSS.
Esegui una query sui valori di stile di un elemento principale utilizzando la regola @container.
Una delle nostre funzionalità preferite del preprocessore CSS è ora integrata nel linguaggio: le regole di stile nidificate.
Scopri come creare stili con ambito che selezionano gli elementi solo all'interno di una sottostruttura del DOM.
Mescola i colori in uno qualsiasi degli spazi colore supportati direttamente dal tuo CSS.
Prefiltra un insieme di elementi secondari prima di applicare la logica An+B.
Crea un'accordion esclusiva con più elementi <details> che hanno lo stesso name.
La proprietà inerte è un attributo HTML globale che semplifica la rimozione e il ripristino degli eventi di input utente per un elemento, inclusi eventi di interesse ed eventi delle tecnologie per la disabilità.
Attiva il ritorno a capo automatico ottimizzato, più che la bellezza della velocità.
Come abbiamo progettato e implementato il supporto degli strumenti griglia CSS in DevTools.
Come supportiamo CSS-in-JS in DevTools e in che modo è diverso dal CSS normale.

DOM shadow

Un nuovo modo per implementare e utilizzare Shadow DOM direttamente nel codice HTML.
Lo stato attuale di interoperabilità dei nomi definiti dall'autore e dello shadow DOM.

Disposizione

Specifica le dimensioni in CSS utilizzando una combinazione di unità di dimensione.
Discover nascosto=until-found, il valore di un attributo può garantire che i contenuti all'interno delle sezioni dell'accordion possano essere trovati e collegati.

Case study su CSS e UI

Che cosa sono esattamente le funzionalità dell'interfaccia utente web e come possono migliorare la canalizzazione di conversione? Quali sono i vantaggi dell'adozione di queste funzionalità.
Scopri i vantaggi delle animazioni con scorrimento di Policybazaar, redBus e Tokopedia.
redBus, Policybazaar e Tokopedia utilizzano tutti l'API View Transiziones e beneficiano di prestazioni migliori e di un'interfaccia utente fluida.
Tokopedia utilizza l'API Popover per ridurre la quantità di codice nella propria applicazione.

Animazioni sul web

L'API Web Animations fornisce primitive efficaci per descrivere le animazioni imperative di JavaScript.
La proprietà animazione-composizione consente di controllare cosa deve accadere quando più animazioni influenzano contemporaneamente la stessa proprietà.
linear() è una funzione di easing CSS che interpola in modo lineare tra i punti, consentendo di ricreare gli effetti di rimbalzo e molla.
Utilizza le sequenze temporali di scorrimento e visualizza le sequenze temporali per creare animazioni a scorrimento in modo dichiarativo.
CORSO
Scopri la storia del responsive design e i concetti fondamentali relativi ai layout adattabili. Imparerai a conoscere le immagini adattabili, gli aspetti tipografici, l'accessibilità e altro ancora.
CORSO
Imparerai le nozioni fondamentali di CSS, come il modello box, a cascata e specificità, flexbox, griglia e z-index. Inoltre, scoprirai funzioni, proprietà logiche e altro ancora per arricchire le tue competenze di sviluppatore front-end.