Vložený blok-koniec - Triky CSS

inset-block-endje logická vlastnosť CSS, ktorá nastavuje dĺžku, ktorú má prvok posunutý v smere bloku od jeho koncovej hrany. Je to niečo ako deklarovanie bottoms výnimkou jeho koncového bodu je určený prvok je direction, text-orientationa writing-moderovnako ako ostatné logické vlastnosti.

Táto vlastnosť je súčasťou špecifikácie úrovne 1 logických vlastností a hodnôt CSS, ktorá je momentálne v stave konceptu editora. To znamená, že definícia a informácie o nej sa môžu meniť medzi dnešným dňom a oficiálnym odporúčaním.

.element ( inset-block-end: 50px; position: relative; /* Apples to positioned elements */ writing-mode: vertical-rl; /* Determines the block start direction */ )

Tak napríklad, ak je režim zápisu nastavený horizontal-lrna inset-block-endmajetku bude správať rovnako ako bottoma nastavte element je odsadenie od spodného okraja. Pre positionrovnaký efekt musíte dokonca určiť explicitný výraz pre rovnaký prvok, rovnako ako bottoma ďalšie vlastnosti fyzického posunu.

Ale zmeňte element writing-modena niečo podobné vertical-lra „spodná“ hrana sa otočí vo vertikálnom smere, čím sa bude chovať viac ako rightvlastnosť.

Syntax

inset-block-end: ;

Pôvodná hodnota: auto
Platí pre: umiestnené prvky
Zdedené: č
Percentá: pokiaľ ide o zodpovedajúce fyzické vlastnosti
Vypočítaná hodnota: rovnaká ako zodpovedajúca bottomvlastnosť
Typ animácie: podľa typu vypočítanej hodnoty

Hodnoty

inset-block-endmá dĺžku a podporuje globálne kľúčové slová. Jeho predvolená hodnota je auto.

/* Length values */ inset-block-end: 50px; inset-block-end: 4em; inset-block-end: 3.5rem inset-block-end: 25vh; /* Percentage values */ inset-block-end: 50%; /* Keyword values */ inset-block-end: auto; /* initial value */ /* Global values */ inset-block-end: initial inset-block-end: inherit; inset-block-end: unset;