CSSの「margin-top」プロパティの役割は何ですか?

CSSのmargin-topプロパティは、要素の上部余白の大きさを設定するために使用されます。これは、要素とその上にある要素の間に空いている領域の大きさを定義します。

具体的には、margin-top プロパティは、要素の上部端と親要素の上部端との間の距離、あるいは、要素の上部端と上部の隣接する要素との間の距離を制御します。

底部と縁との間隔

要素の上部に余白を与えて、上にあるコンテンツから要素を下へ押すには正の値を使用すればよく、要素を上に被せる負の余白効果を与えたい場合は負の値を使用します。

上部の半分を覆う。

以下を例として示します。

.margin-top-example {

margin-top: 20px; /* 顶部边距为20像素 */

}

.negative-margin-top-example {

margin-top: -10px; /* 负顶部边距，元素向上覆盖上方内容 */

}

ちなみに、margin-top プロパティは要素自身の外側の余白にしか影響せず、内部コンテンツの位置は変わりません。内部コンテンツのレイアウトを調整したい場合は、padding-top プロパティの使用を検討してください。