Margin-block-end - CSS-gudrybės | CSS almanachas 2025

margin-block-endCSS nuosavybė apibrėžia, kiek vietos palei išorinį nesibaigianti kraštas bloke kryptimi elementas. Jis įtrauktas į CSS loginių ypatybių 1 lygio specifikaciją, kuri šiuo metu yra darbo projekte.

.element ( margin-block-end: 25%; writing-mode: vertical-lr; )

Galūnė krašto į bloko kryptimi lemia elemento writing-mode, directionir text-orientation. Taigi, naudojant margin-block-endhorizontaliame kontekste iš kairės į dešinę, jis veikia taip margin-bottompat, kaip pradinis elemento kraštas yra jo apačia.

Bet jei pakeisime writing-mode, tarkime, į vertikalųjį elementą, elementas pasisuks, galinį kraštą nukreipdamas į dešinę. Todėl margin-block-endelgiasi taip pat margin-right. Iš esmės pradinis kraštas yra santykinis su jo tekėjimo kryptimi. Tai ir turime omenyje kalbėdami apie „logines“ savybes.

Sintaksė

margin-block-end:

Labai keista matyti, kai vienos nuosavybės sintaksė dokumentuose nurodo kitos CSS nuosavybės teisės sintaksę, bet iš tikrųjų tai yra. Iš esmės bandoma pasakyti tai, kad nuosavybė priima tas pačias reikšmes, margin-topkurios atitinka šią sintaksę:

margin-top: | | auto;

Pradinė vertė: 0
Taikoma: visiems elementams, išskyrus vidinius stalo elementus, rubino pagrindo talpas ir rubino anotacijos talpyklas
Paveldima: ne
Procentai: kaip ir atitinkamai fizinei nuosavybei
Apskaičiuota vertė: tokia pati kaip ir atitinkamų margin-*savybių
Animacijos tipas: pagal apskaičiuotą vertės tipą

Vertybės

margin-block-end priima vieną ilgio ar raktinio žodžio vertę.

/* Length values */ margin-block-end: 20px; margin-block-end: 2rem; margin-block-end: 25%; /* Keyword values */ margin-block-end: auto; /* Global values */ margin-block-end: inherit; margin-block-end: initial; margin-block-end: unset;