CSSでマージンを使用する方法

CSS の margin 属性は、要素の周囲の空白領域を設定するために使用されます。要素の 4 辺には、上マージン、右マージン、下マージンと呼ばれる異なる値を設定できます。左余白。

#CSS での margin の使用

margin プロパティは、要素の周囲に空白領域を設定するために CSS で使用されます。 .It ピクセル (px)、パーセント (%)、またはその他の長さの単位。 margin は、上マージン、右マージン、下マージン、左マージンと呼ばれる要素の 4 つの辺に異なる値を設定できます。

使用法

マージン属性の構文は次のとおりです:

<code>margin: top-margin right-margin bottom-margin left-margin;</code>

そのうち、上マージン、右マージン、下マージン、左-margin それぞれ上マージン、右マージン、下マージン、左マージンの値を表します。値を 1 つだけ指定した場合、その値は 4 つの余白すべてに適用されます。例:

<code>margin: 10px;</code>

は、要素のすべての余白に 10 ピクセルの空白を設定します。

効果

margin 属性は、ページ上の要素の位置に影響します。マージンを適切に設定することで、要素の間隔、配置、レイアウトを制御できます。たとえば、次の CSS コードは、段落要素の上マージンを 20 ピクセル、右マージンを 10 ピクセル、下マージンを 30 ピクセルに設定します。

<code>p {
  margin: 20px 10px 30px;
}</code>

これにより、段落間にギャップが生じます。要素と前の要素の右端から 20 ピクセルの空白、次の要素から 10 ピクセルの空白、次の要素から 30 ピクセルの空白。

注意事項

マージン属性を使用する場合は、次の点に注意する必要があります。

マージン属性により、全体の比率が増加します。要素のサイズ。したがって、余白を設定するときは、要素のサイズとページ レイアウトを考慮する必要があります。
• margin プロパティでは境界線は作成されません。境界線を作成する必要がある場合は、border プロパティを使用する必要があります。
• margin 属性を padding 属性と組み合わせて使用​​すると、要素の内側と外側の空白を制御できます。

以上がCSSでマージンを使用する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。