Marge - CSS
Création des marges sur des pages html avec le CSS.
Explication
Propriété :
MargeToutes les marges (haute, droite, basse, gauche) peuvent être combinées avec l’utilisation de ce marqueur. Usage:
margin: 20px;
margin: 10px 20px 30px 10px;
margin: 10px 20px;
margin: 20px 10px 30px;
Définition:
La marge peut être configurée avec le marqueur « marge ».
Il se présente avec les valeurs suivantes.
a)20px : Ceci établira une marge de 20px sur les quatre côtés (haute, droite, basse, gauche).
b)10px 20px 30px 10px: Ce format configurera la marge selon l'ordre haute, droite, basse, gauche.
c)10px 20px : Ce format configurera la marge sur haute et droite. La marge inférieure prendra la valeur de la marge supérieure (10px) et la marge gauche prendra la valeur de la marge droite (20px).
d)20px 10px 30px: Ce format configurera la marge supérieure, droite, et inférieure. La marge gauche prendra la valeur de la marge droite.
Ces valeurs peuvent se présenter en pourcentage, points ou pixels.
Exemple 1: <div align=right style="
margin: 20px;">
Ici, on a établit une marge de 20 pixels.
Vous pouvez constater que ce paragraphe a des marges sur les quatre côtés.
</div>
Résultat: Ici, on a établit une marge de 20 pixels. Vous pouvez constater que ce paragraphe a des marges sur les quatre côtés.
Exemple 2: <div style="
margin: 10px 50px 30px 5px;">
Ici, on a établie la marge avec quatre valeurs.
Vous pouvez constater que ce paragraphe a une marge supérieure de 10px, marge droite de 50px, marge inférieure de 30px et 5px de marge gauche
</div>
Résultat: Ici, on a établie une marge avec quatre valeurs. Vous pouvez constater que ce paragraphe a une marge supérieure de 10px, marge droite de 50px, marge inférieure de 30px et 5px de marge gauche.
Exemple 3: <div style="
margin: 20px 40px;">
Ici, on a établit une marge avec deux valeurs.
Vous pouvez constater avec ce paragraphe que la marge supérieure et inférieure est de 20px et 40px sur la gauche et droite.
</div>
Résultat: Ici, on a établie une marge avec deux valeurs. Vous pouvez constater avec ce paragraphe que la marge supérieure et inférieure est de 20px et 40px sur la gauche et droite.
Exemple 4: <div style="
margin: 10px 50px 40px;">
Ici, on a établie une marge avec trois valeurs. Vous pouvez constater que ce paragraphe a une marge supérieure de 10px, de 50px à droite, et 40px sur la marge inférieure et à gauche. La marge gauche prend la valeur de son côté opposé qui est de 50px.
</div>
Résultat: Ici, on a établie une marge avec trois valeurs. Vous pouvez constater que ce paragraphe a une marge supérieure de 10px, de 50px à droite, et 40px sur la marge inférieure et à gauche. La marge gauche prend la valeur de son côté opposé qui est de 50px.
A Note
CSS - Feuilles de style en cascade peut être utilisé avec les balises HTML, comme expliqué dans ce site. Cette simple CSS vous permettra de créer beaucoup plus élégant et soigné html des pages web. Cela ne nécessite pas de logiciels ou d'autres codages. Tous les navigateurs web sont capables de transmettre des codes CSS.
Note 2: Si nécessaire, vous pouvez à l'aide de <span> au lieu de <div> marques. div balise de début et de fin sur les nouvelles lignes. span ne dépassera pas la balise domaine.