Explication détaillée de l'utilisation des marges externes CSS

Cet article explique en détail l'utilisation des marges CSS

h2{margin:10px 0;}
p{margin:20px 0;}
......<h2>这是一个标题</h2><p>
    <h2>这是又一个标题</h2></p>本例中，第一个h2的margin-bottom（10px），p的margin-top（20px），第二个h2的margin-top（10px）将被合并，它们之间的margin间隙最后是（20px），即取三者之间最大的那个值。

Syntaxe :

marge : [ < ; longueur> | | auto ]{1,4} | hériter

valeur par défaut : Regardez chaque attribut indépendant

S'applique à  : tous les éléments, sauf table | inline-table | table-caption table éléments de classe À l'extérieur

HéritéSexe : Aucun

AnimationSexe : Oui

Valeur calculée : Regardez chaque attribut indépendant

Attribut associé : [ margin-top ] || [ margin-right ] | -bottom ] || [ marge-gauche]

Valeur :

• auto : horizontal (Par défaut) Par écrit En mode , la valeur calculée de margin-top/margin-bottom est 0 et margin-left/margin-right dépend de l'espace disponible. Pour plus de détails, voir : mot-clé auto

• de la série de marge : utilisez la valeur de longueur pour définir le remplissage externe. Peut être négatif

•  : utilisez le pourcentage pour définir le rembourrage extérieur. En mode d'écriture horizontal (par défaut), référez-vous à son bloc contenant largeur pour le calcul. Dans les autres cas, référez-vous à la hauteur, qui peut être négative

Description :

Récupérer ou définir les marges étendues des quatre côtés de l'objet.

• Si les quatre valeurs de paramètres sont fournies, elles seront appliquées aux quatre côtés dans l'ordre supérieur, droit, inférieur et gauche.

• Si un seul est fourni, il sera utilisé pour les quatre côtés.

• Si deux sont fournis, le premier est pour le haut et le bas, et le second est pour la gauche et la droite.

• Si trois sont fournis, le premier est pour le haut, le deuxième est pour la gauche et la droite et le troisième est pour le bas.

• Les éléments en ligne non remplacés peuvent utiliser cet attribut pour définir les correctifs extérieurs sur les côtés gauche et droit. Si vous souhaitez définir les correctifs extérieurs sur les côtés supérieur et inférieur, vous devez le faire. faites d'abord en sorte que l'objet apparaisse au niveau du bloc ou au niveau du bloc en ligne.

• Les marges étendues sont toujours transparentes.

• Certaines marges adjacentes fusionneront, ce que nous appelons le pliage des marges :

h2{margin:10px 0;}
p{margin:20px 0;}
......<h2>这是一个标题</h2><p>
    <h2>这是又一个标题</h2></p>本例中，第一个h2的margin-bottom（10px），p的margin-top（20px），第二个h2的margin-top（10px）将被合并，它们之间的margin间隙最后是（20px），即取三者之间最大的那个值。

L'élément parent fusionne avec le premier/dernier élément enfant avec marge

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!