Bonjour et bienvenue dans les styles de boîtes CSS - dans le dernier module, nous avons examiné le contenu de vos boîtes ; dans ce module, nous verrons le style de la boîte elle-même, en manipulant la couleur de fond et les images, les bordures et d'autres parties de la boîte. Nous aborderons également d'autres sujets, de la création de tableaux HTML à l'application d'effets avancés tels que les filtres et les modes de fusion.

Prérequis

Avant de commencer ce module, vous devez déjà être familiarié avec les bases HTML, comme évoquées dans le module Introduction à HTML et être à l'aise avec les fondamentaux de CSS, tels que vus dans Introduction à CSS.

Note : Si vous travaillez sur un ordinateur/tablette/autres appareils avec lesquels vous n'avez pas la possibilité de créer vos propres fichiers, vous pouvez essayer  (la plupart) des exemples de code en ligne en utilisant les programmes de codage comme JSBin ou Thimble.

Guides

Cet article vous enseignera tout ce dont vous avez besoin pour appliquer un style aux boîtes CSS de votre page de façon intéressante et utile.

Récapitulatif du modèle de boîte
Nous avons vu les bases du modèle de boîte CSS dans notre module Introduction à CSS. Cet article vous en fournira un récapitulatif et vous plongera dans quelques détails supplémentaires sur le sujet.
Arrières-plans
En CSS, vous pouvez faire beaucoup pour donner un style à l'arrière-plan de votre contenu. Nous avons déjà examiné quelques utilisations simples, telles que les couleurs et les images d'arrière-plan de base ; dans cet article, nous allons évoquer tout le sujet et regarder quelques fonctionnalités avancées, comme des images de fond multiples et des dégradés de couleurs.
Bordures
Encore une fois, nous avons déjà examiné un peu les bordures des utilisations simples comme la définition des couleurs et des styles de bordure. Ici, nous vous donnerons une idée de ce qui est disponible, comme les coins arrondis et les images de bordure.
Styles de tableaux
Donner un style à un tableau HTML n'est pas le métier le plus intéressant du monde, mais parfois nous devons le faire. Cet article fournit un guide pour que les tableaux HTML soient beaux, avec les outils détaillés dans les articles précédents.
Effets de boîte avancés
Cet article fait office de boîte à outils, offrant une introduction à certaines des fonctionnalités avancées disponibles pour les styles de boîte qui ne rentrent pas dans les autres catégories ci-dessus - comme les ombres, les modes de fusion et les filtres.

Auto-évaluations

Les auto-évaluations suivantes testeront votre compréhension des techniques de style de boîtes étudiées tout au long de ces guides.

Création de papier à en-tête fantaisie
Si vous voulez faire une bonne impression, écrire une lettre sur un joli papier à en-tête peut être un très bon début. Dans cette auto-évaluation, nous vous mettons au défi de créer un modèle en ligne pour réaliser un tel papier.
Une boîte à l'air cool
Ici vous aurez plus de pratique dans la création de boîtes à l'air cool, en essayant de créer une boîte attrayante.

Voir aussi

Créer de belles boîtes
Quelques idées supplémentaires de styles de boîtes personnalisées.

Étiquettes et contributeurs liés au document

 Contributeurs à cette page : loella16, tonybengue
 Dernière mise à jour par : loella16,