๐Ÿ”ธmargin

CSS โŸฉ box model โŸฉ margin

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

Was this helpful?