Que signifie la marge en CSS

La marge en CSS est une propriété utilisée pour définir l'espace autour d'un élément afin de contrôler l'espacement entre les éléments et de créer une séparation visuelle. Les valeurs d'attribut​​de margin incluent margin-top, margin-right, margin-bottom et margin-left, qui représentent respectivement les marges dans les quatre directions de l'élément et peuvent être définies dans différentes unités. Lorsque vous utilisez la marge, faites attention à la largeur réelle de l'élément. Cela n'affecte pas la taille réelle de l'élément, mais uniquement sa position.

Marge en CSS

Qu'est-ce que la marge ?

margin est une propriété en CSS utilisée pour définir l'espace autour d'un élément, c'est-à-dire la distance entre l'élément et d'autres éléments ou conteneurs.

Fonction :

la marge est utilisée pour contrôler l'espacement entre les éléments, créer une séparation visuelle et améliorer la lisibilité et la beauté de la mise en page.

Valeur d'attribut :

margin Vous pouvez spécifier quatre valeurs, qui représentent les marges dans les quatre directions de l'élément :

• margin-top : marge supérieure
• margin-right : marge droite
• margin-bottom : Marge inférieure
• margin-left : Marge gauche

Utilisation :

margin peut être définie des manières suivantes :

<code class="css">/* 内联样式 */
<p style="margin: 10px;">段落文本</p>

/* 外部样式表 */
p {
  margin: 10px;
}

/* 缩写形式 */
p {
  margin: 10px 20px 10px 15px; /* 上右下左 */
}</code>

Unit : les unités peuvent utiliser px, em , rem, % et autres unités de longueur CSS courantes.

Héritage :

la marge ne sera pas héritée, ce qui signifie que les éléments enfants n'hériteront pas de leur valeur de marge de l'élément parent.

Conseils :

Avant d'utiliser la marge, il est préférable d'effacer toutes les valeurs par défaut, vous pouvez utiliser

.

• Soyez conscient de la largeur réelle de l'élément lorsque vous utilisez la marge, car cela affectera la mise en page de la page. margin: 0;
margin n’affecte pas la taille réelle de l’élément, seulement sa position.

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!