Apprendre CSS peut sembler être une tache impressionnante. Cependant pour vous aider nous avons écrit de nombreux tutoriels a propos de CSS. Certains d'entre eux sont à l'attention des non initier, tandis que d'autres présentent des fonctionnalitées complexes qui peuvent être utile aux utilisateurs expérimenté.
Cette page les listes tous, avec une courte description. Ils sont regroupés par complexité de sorte que vous pouvez choisir la plus appropriée à votre niveau.
Note de l'éditeur: Vous devriez penser à utiliser les tags "niveau de difficulté", sur les pages de tutoriel donc les listes basées sur la difficultés peuvent être construites automatiquement.
Tutoriel CSS pour Débutants
- Débuter
- Ce guide est destiné aux non initiés : vous n'avez jamais écrit une seule ligne de CSS ? — Cet article est pour vous! Il explique les concepts fondamentaux du langage et vous guide via la rédaction de feuilles de style basiques.
- Utiliser les arrière-plans multiples
- Les arrières-plans sont fondamentaux afin d'obtenir un beau design : CSS vous permet d'en définir plusieurs pour chaque boite. Ce tutoriel explique comment elles interagissent et comment les utiliser pour réaliser de jolis effets.
- Mise à l'échelle des images d'arrière-plan (en anglais)
- CSS vous permet de redimensionner des images utilisées comme élément d'arrière plan. Ce tutoriel décrit comment faire cela simplement.
- Media queries
- La taille des écrans, ou la nature des appareils comme les écrans tactiles ou feuilles imprimées, varie grandement de nos jours. Les Media queries sont des briques fondamentales pour construire des sites Web avec un rendu de grande qualité sur n'importe quel appareil.
- Comprendre le z-index
- Contrôler la superposition des boites est une caractéristique fondamentale pour les développeurs Web. Il ne s'agit pas de quelque chose de difficile cependant cela requiert une connaissance basique du CSS.
Tutoriel intermédiaire en CSS
Après la sortie de CSS2 (Niveau 1), les nouvelles fonctionnalités ont été ajoutées dans CSS. Certaines d'entre elles sont élégantes et autonomes. Elles sont faciles à utiliser par quiconque avec une bonne compréhension des concepts basique.
- Compteur CSS
- Compter les éléments et pages est une tache aisée en CSS. Apprenez à utiliser
counter-reset,counter-increment,counters(), etcounter(). - Animations CSS
- Les animation CSS3 vous permettent de définir des configurations de style, comme les keyframes, et de réaliser une transition entre elles pour définir une animation.
- Transitions CSS
- Les transitions CSS3 vous permettent de définir une animation entre plusieurs styles et contrôlent la voie manière laquelle les transitions s'appliquent.
- Transformations CSS
- Les transformations CSS vous permettent de changer la position d'éléments en modifiants leurs coordonnées spatiales: comme des translations, rotations et déformations en espaces 3D et 2D.
- Gradients CSS
- Les gradients CSS sont des images qui changent de façon homogène d'une couleur à une autre. Il y a différents types de gradients possibles en CSS : linéaire ou radial, répétable ou non. Ce tutoriel décrit comment les utiliser.
Tutoriels avancés en CSS
CSS3 possède de nouvelles fonctionnalités vous permettant de créer des mises en pages complexes. Même les plus simples de ces méthodes, peuvent être complexes pour un débutant.
- Mises en pages Multi-colonnes CSS
- CSS3 introduit une nouvelle mise en page vous autorisant à définir facilement des éléments sur plusieurs multiples colonnes. Cependant les textes sur plusieurs colonnes ne sont pas si communs sur des écrans. Pourtant cela s'avère très pratique lorsque l'on imprime des pages ou pour indexer.
- Mises en pages flexibles de boites"
- Cette nouvelle mise en page vous permet de donner de la flexibilité aux boites, permettant à celles-ci d'être redimensionnées de façon fluide. Il s'agit d'une façon puissante de décrire des interfaces complexes.