CATALOGUE Code & Data Formation XHTML/CSS Apprendre CSS 3

Centrer un site web avec CSS

Retour à la formation
Chapitre 23 Leçon 6
Précédent
Suivant

Apprenez à centrer un site web dans la page du navigateur en utilisant un container CSS, et découvrez la gestion des marges et paddings.

Détails de la leçon

Description de la leçon

Dans cette leçon, vous apprendrez à centrer votre site web en utilisant les techniques de CSS. Vous allez découvrir comment créer un container principal, souvent appelé 'wrap', et comment lui donner une largeur fixe de 960 pixels, ce qui est une taille standard pour des écrans classiques. Ensuite, nous verrons comment utiliser la propriété 'margin' avec la valeur 'auto' pour centrer le container dans la page du navigateur. Pour affiner la mise en page, nous ajouterons également des marges et des paddings afin de garantir que le contenu ne soit pas collé aux bords du container. Vous apprendrez également à utiliser l'inspecteur d'éléments pour vérifier et ajuster les styles CSS en temps réel.

Nous aborderons aussi les réglages des marges pour les titres et les paragraphes afin de répondre aux spécifications de votre designer, tout en garantissant que chaque élément ait l'espacement nécessaire pour une lecture agréable. Enfin, nous appliquerons des ajustements sur les éléments de navigation et de pied de page pour assurer une mise en page cohérente et esthétiquement plaisante. Cette leçon est essentielle pour quiconque souhaite maîtriser les fondamentaux de la mise en page avec CSS.

Objectifs de cette leçon

Les objectifs de cette vidéo sont d'apprendre à centrer un site web, à utiliser un container CSS et à gérer les marges et paddings pour une mise en page homogène.

Prérequis pour cette leçon

Pour suivre cette vidéo, il est recommandé d'avoir des connaissances de base en HTML et CSS.

Métiers concernés

Les compétences acquises dans cette leçon sont utiles pour les développeurs front-end, les web designers et les intégrateurs web.

Alternatives et ressources

Comme alternatives, vous pouvez utiliser des frameworks CSS comme Bootstrap ou Foundation qui offrent des solutions de mise en page préconfigurées.

Questions & Réponses

Un 'wrap' est un container principal utilisé pour centrer le site dans la page du navigateur et contenir tout le contenu du site.
La valeur 'auto' pour les marges latérales permet de centrer automatiquement un élément horizontalement dans son conteneur.
La taille standard recommandée pour un container principal est de 960 pixels, bien que des tailles plus larges comme 1280 pixels puissent être utilisées pour des écrans plus grands.