Veerisesisene algus - CSS-trikid | CSS-i almanahh 2025

margin-inline-startVara CSS määratleb ruumi mööda välimine lähtekohaks serv element inline suunas. See sisaldub CSSi loogiliste omaduste 1. taseme spetsifikatsioonis, mis on praegu tööprojektis.

.element ( margin-inline-start: 25%; writing-mode: vertical-lr; )

Lähteaine serv inline suunas määrab elemendi writing-mode, directionja text-orientation. Niisiis, margin-inline-starthorisontaalses vasakult paremale kontekstis kasutamisel toimib see samamoodi nagu margin-leftelemendi algserv on vasak külg.

Kuid kui me muudame writing-modenäiteks vertikaalseks, pööratakse element päripäeva, asetades alguserva ülemise poole. Selle tulemusena margin-inline-startkäitub täpselt nagu margin-top. Põhimõtteliselt on lähteserv voolava suuna suhtes. Seda me mõtleme, kui räägime "loogilistest" omadustest.

Süntaks

margin-inline-start:

Päris imelik on näha, kuidas ühe omaduse süntaks viitab dokumentatsioonis teise CSS-i atribuudi süntaksile, kuid see on tegelikult see. Põhimõtteliselt üritatakse öelda seda, et vara aktsepteerib samu väärtusi, margin-topmis järgivad seda süntaksit:

margin-top: | | auto;

Algne väärtus: 0
Kehtib kõigi elementide kohta, välja arvatud sisemised lauaelemendid, rubiinpõhjad ja rubiinmärkimistega konteinerid
Päritud: ei
Protsendid: nagu ka vastava füüsilise omaduse osas
Arvutatud väärtus: sama mis vastavatel margin-*omadustel
Animatsiooni tüüp: arvutatud väärtuse tüübi järgi

Väärtused

margin-block-start aktsepteerib ühe pikkuse või märksõna väärtust.

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