Plein d'exemples de timelines réalisées en CSS.
Une ode à CSS.
Et je ne peux que plussoyer. CSS est souvent décrié mais il permet de faire des choses tellement incroyables avec un syntaxe des plus simples.
Très ingénieux. Je pense que c'est déjà assez largement utilisé sans qu'on s'en rende compte.
L'idée est de ne pas utiliser d'animations basiques mais plutôt des animations différentes en fonction de l'action qui vient d'être faite.
Si vous avez la flemme de tout lire, les vidéos sont très parlantes.
Via https://mastodon.social/users/stephaniewalter/updates/2406448
Tout ce qu'il faut savoir sur Flexbox ! Il y a des outils pédagogiques, des showcases, des cheat-sheets, etc.
Belle démo d'animation CSS.
Jouer avec les animations CSS en live.
GridLayout arrive tout doucement. Flex a déjà résolu bon nombre de problèmes du passé mais Grid permet de nouvelles choses et renforce la séparation entre structure (HTML) et style (CSS).
Intéressant même si ça n'apporte pas beaucoup plus que la console web qui est déjà très bien faite pour accéder aux propriétés CSS d'un élément HTML.
Visiblement il s'agit plus de Selectors Module Level 4 que de CSS4 à proprement parler mais ça donne quand même une bonne vision de ce qu'il serait possible de faire en CSS dans les années à venir.
Flexbox expliqué en GIF animé.
Le dessin en CSS pour les nuls.
Une saine lecture. C'est du classique mais il est toujours bon de rappeler les possibilités offertes par CSS. Bon par contre, n'abusez pas de sélecteurs ultra compliqués. Même s'il est possible de faire des choses assez complexes, ça ne veut pas dire que c'est judicieux. En ce qui me concerne, les sélecteurs avancés me sont surtout utiles quand je dois customiser du code HTML sur lequel je n'ai pas la main.
Juste une petite rectification sur l'article :after et :before sont des pseudo-éléments et pas des pseudo-classes.
Par contre quand je vois ce type d'articles je m'interroge toujours sur les performances de chaque sélecteur. Je me doute qu'à moins d'y aller comme un bourrin, les différences en perf sont négligeables mais si quelqu'un a un comparatif ça m'intéresse.
Bon forcément le nom du site fait sourire mais y a quand même des trucs pas mal :)
Une idée intéressante pour styliser un bloc de manière légère et discrète.
Quelques réalisations en pur CSS, sans JS.
Excellent cet outil ! Il vous aide à choisir des ensembles de couleurs qui vont bien ensemble selon différents procédés (couleurs complémentaires, analogues, etc.).
Utiliser des multiples de 8pt pour dimensionner une UI, pour améliorer le rendu lors d'un "scaling" du navigateur et éviter les demi-pixels par exemple.
BEM a l'air d'être une méthodologie intéressante pour la maintenabilité du code CSS dans les gros projets. Surtout couplée à SASS.
Via https://blog.stephaniewalter.fr/la-semaine-en-pixels-16-decembre-2016/
Bluffant.