CSS et UI
Découvrez les outils et techniques de Chrome permettant d'améliorer la conception du CSS et de l'interface utilisateur de votre site.
Améliorez vos compétences en développement d'UI
Style de la barre de défilement
Utilisez les propriétés
scrollbar-width et scrollbar-color pour appliquer un style aux barres de défilement.
Solde de retour automatique à la ligne CSS
CSS est une technique typographique classique qui consiste à créer manuellement des sauts de ligne pour les blocs de texte équilibrés.
Guide des couleurs CSS haute définition
CSS Color 4 propose sur le Web des outils et fonctionnalités de couleur à large gamme de couleurs: plus de couleurs, plus de fonctions de manipulation et de meilleurs dégradés.
Modèle d'objet typé CSS
La fonction CSS Typed Object Model (Typed OM) permet d'utiliser des types, des méthodes et un modèle d'objet flexible avec des valeurs CSS.
Premiers pas avec les requêtes de style
Interrogez les valeurs de style d'un élément parent à l'aide de la règle @container.
Imbrication CSS
L'une de nos fonctionnalités préférées de préprocesseur CSS est désormais intégrée au langage: les règles de style d'imbrication.
CSS @scope
Découvrez comment créer des styles de portée qui sélectionnent des éléments uniquement dans une sous-arborescence de votre DOM.
CSS color-mix()
Mélangez les couleurs de l'un des espaces de couleurs disponibles directement depuis votre code CSS.
Plus de contrôle sur les sélections nth-child()
Préfiltrez un ensemble d'éléments enfants avant d'y appliquer la logique An+B.
Accordéon exclusif
Créez un accordéon exclusif avec plusieurs éléments
<details> ayant le même name.
Présentation de l'inert
La propriété inerte est un attribut HTML global qui simplifie la suppression et la restauration des événements d'entrée utilisateur pour un élément, y compris les événements de sélection et les événements issus de technologies d'assistance.
Retour à la ligne CSS élégant
Activer le retour automatique à la ligne optimisé, pour privilégier la beauté plutôt que la vitesse
Grille CSS dans les outils de développement
Découvrez comment nous avons conçu et implémenté les outils de grille CSS dans les outils de développement.
Compatibilité CSS-in-JS dans les outils de développement
Comment nous prenons en charge le CSS-in-JS dans les outils de développement et en quoi il diffère du CSS standard
Mise en page
Comment utiliser calc()
Spécifiez les tailles dans le code CSS en combinant plusieurs unités de dimensionnement.
Événement pour une position CSS persistante
Consignez les messages et exécutez JavaScript.
Rendre le contenu réduit accessible
La propriété "hidden=until-found", une valeur d'attribut permet de garantir que le contenu des sections "accordéon" peut être trouvé et associé à des liens.
Animations sur le Web
API Web Animations
L'API Web Animations fournit des primitives performantes pour décrire des animations impératives à partir de JavaScript.
Plusieurs effets d'animation
La propriété animation-composition permet de contrôler ce qui doit se passer lorsque plusieurs animations affectent simultanément la même propriété.
Courbes d'animation complexes avec linear()
linear() est une fonction de lissage CSS qui effectue une interpolation linéaire entre ses points, ce qui vous permet de recréer des effets de rebond et de ressort.
Animations liées au défilement
Utilisez les timelines de défilement et les timelines d'affichage pour créer des animations liées au défilement de manière déclarative.
COURS
Apprendre le responsive design
Lisez l'histoire du responsive design et découvrez les principes de base des mises en page responsives. Vous en apprendrez davantage sur les images responsives, la typographie, l’accessibilité et plus encore.
COURS
Apprendre à utiliser CSS
Vous allez découvrir les principes de base du CSS, comme le modèle "box", la cascade et la spécificité, "flexbox", la grille et le z-index. Vous en apprendrez également plus sur les fonctions, les propriétés logiques, etc. afin d'approfondir vos compétences en matière de développement front-end.