inset-inline-startje lastnost CSS, ki nastavi dolžino odmika elementa v začetni smeri. To je nekaj podobnega, razglasi left, da to velja za nameščenimi elementi in odmikov element v levo smer, razen svoje začetne in končne točke se lahko spremeni na podlagi element je direction, text-orientationin writing-mode, tako kot druge logične lastnosti.
Lastnost je del specifikacije CSS logičnih lastnosti in vrednosti 1, ki je trenutno v stanju osnutka urejevalnika. To pomeni, da se lahko definicija in informacije o njej spremenijo od zdaj do uradnega priporočila.
.element ( inset-inline-start: 50px; position: relative; /* Apples to positioned elements */ writing-mode: vertical-rl; /* Determines the block start direction */ )Tako, na primer, če je način pisanja nastavljen horizontal-lrna inset-inline-startnepremičnine bo deloval tako kot nastavitev left, pobot element iz levega roba. Za positionisti element morate celo navesti eksplicitno za isti element, tako kot lastnosti fizičnega odmika.
Toda spremenite elemente writing-modena nekaj podobnega vertical-lrin "začetni" rob se zasuka v navpični smeri, kar deluje bolj kot topnamesto tega.
Sintaksa
inset-inline-start: ;- Začetna vrednost:
auto - Velja za: pozicionirane elemente
- Podedovano: ne
- Odstotki: kot za ustrezno fizično lastnost
- Izračunana vrednost: enako kot ustrezna
leftlastnost - Vrsta animacije: po izračunani vrednosti
Vrednote
inset-blockima dolžinsko vrednost in podpira globalne ključne besede. Njegova privzeta vrednost je auto.
/* Length values */ inset-inline-start: 50px; inset-inline-start: 4em; inset-inline-start: 3.5rem inset-inline-start: 25vh; /* Percentage values */ inset-inline-start: 50%; /* Keyword values */ inset-inline-start: auto; /* initial value */ /* Global values */ inset-inline-start: initial inset-inline-start: inherit; inset-inline-start: unset;Podpora brskalnika
| IE | Rob | Firefox | Chrome | Safari | Opera |
|---|---|---|---|---|---|
| Ne | Ne | 63+ | Ne | Ne | Ne |
| Android Chrome | Android Firefox | Brskalnik Android | iOS Safari | Opera Mini |
|---|---|---|---|---|
| Ne | 79+ | Ne | Ne | Ne |
Demo
nadaljnje branje
- Specifikacija logičnih lastnosti in vrednosti CSS 1. stopnje (urednikov osnutek)
- Dokumentacija MDN
- Razumevanje logičnih lastnosti in vrednot (Smashing Magazine)
- Logične lastnosti CSS (Adrian Roselli)
- Dvosmerna horizontalna pravila v CSS (Hussein Al Hammad)