margin

重點

  • margin 的「背景」永遠是「透明」的。

  • 如果是 inline 元素,margin 的「垂直方向沒有效果」。

  • 大小可使用 px , rem ... 等單位,也可以設定 auto 讓網頁自動計算。

  • 大小若設定 %,則以「父元素寬度」為準。

  • 大小可以是「負值」,此時不同區塊可能會產生「重疊」的現象。

margins between elements

/* 
    use adjacent sibling combinator (+) 
    to apply a margin between buttons.
*/
.button + .button {
    margin-block-start: 0.5em;
}

Last updated