Notion de marges en CSS
Comment définir une marge avec CSS ?
Les marges en CSS
Comment définir une marge avec CSS ?
Héritage : Il n’y pas de notion d’héritage pour les marges (voir notion d’héritage (avec les feuilles de styles) sur ce lien)
Syntaxe CSS
margin-top: espace en pixels, pourcentage ou auto;margin-left: espace en pixels, pourcentage ou auto;margin-right: espace en pixels, pourcentage ou auto;margin-bottom: espace en pixels, pourcentage ou auto;
Vous avez 3 possibilités pour définir la valeur de la marge :
- Espace en pixels (exemple 10px)
- Pourcentage (70%)
- auto (réglage automatique)
A noter : Vous pouvez aussi déclarer vos marges en css comme cela : margin: 10px 10px 10px 10px;
Les valeurs définissent l’espace entre les éléments HTML dans cet ordre :
- haut
- droite
- bas
- gauche
A savoir !
Si ne renseignez qu’une valeur, elle sera prise par défaut pour les autres espaces entre les éléments HTML : margin: 10px; pour par exemple les marges sur (espace sur des listes type li)
Si vous renseignez deux ou trois valeurs, elles seront la références pour les cotés opposés.
margin: 10px 10px; /* 2 valeurs */ margin: 10px 10px 10px; /* 3 valeurs */
Vous pouvez définir des marges à zéro, Si vous ne définissez pas les marges, elles prenent 0 comme valeur par défaut : margin: -10px;
De nombreuses différences entre navigateurs résultes de problèmes de marges définie différement entre deux navigateurs. Pour combattre cela, il suffit de les mettres à « 0 » p {margin: 0;}
Attention : Il est possible de ne pas mettre « px » si la valeur est zéro (Voir exemple ci-dessus)
Exemple concert ?
L’exemple ci-dessous défini une marge de 20px à la balise BODY
body{ margin: 20px; background: #eeeeee; font-size: small; font-family: "Tahoma", Arial, sans-serif; text-align: left;}Le CSS en 3 questions/réponses – en bref
🖥️ C'est quoi HTML et CSS ?
Le CSS est un langage informatique utilisé pour mettre en forme les fichiers HTML sur un site web. Ainsi, les fichiers CSS permettent de gérer l’aspect graphique d’une page en HTML
🤔 Qu'est-ce que le CSS ?
CSS est l’acronyme de « Cascading Style Sheets » c’est à dire « feuille de style en cascade ». Le CSS est un langage informatique permettant de mettre en forme des pages web (HTML ou XML).
📆 Différence entre CSS et CSS3 ?
CSS3 est la dernière version de CSS. Il fournit des capacités de type JavaScript. En plus de cela, il fournit également des fonctionnalités de développement mobile.
