scrollbar-gutterVara annab paindlikkuse teha kindlaks, kuidas ruumi brauseri kasutab kuvada kerimisriba, mis suhtleb sisu ekraanil. Spetsifikatsioon kirjeldab seda "kerimisribale ruumi reserveerimiseks" ja see on mõistlik, kuna see on lõpuks vihmaveerenn: konteiner, mis reserveerib ruumi kõigele, mis seal on, ja eraldab selle muudest elementidest.
Nii et oleme kõik samal lehel, kerimisriba on see asi, mis on tavaliselt brauseri paremal küljel (spetsifikatsioonis nimetatakse seda ametlikult "kasutajaagendiks" - või UA), mis näitab teie kerimispositsiooni koguarvu suhtes vaba ruumi veebisaidil.
Need on traditsiooniliselt olnud libiseva indikaatoriga visuaalsed mahutid. Neid nimetatakse klassikalisteks kerimisribadeks . Indikaator asub vihmaveerennis ja vihmaveerenn võtab ekraanil füüsilise kinnisvara.
Viimasel ajal on kerimisriba väljanägemine siiski suundunud millegi palju minimaalsema poole. Nimetame neid ülekatte ribasid ja need on lehe sisu peal istudes kas osaliselt või täielikult läbipaistvad. Teisisõnu, erinevalt klassikalistest kerimisribadest, mis võtavad ekraanile füüsilise kinnisvara, istuvad ülekattega kerimisribad ekraani sisu kohal.
Sel ajal, kui oleme käes, võivad kerimisribad hüpata ka teistesse kohtadesse. Lisaks sellele, et istute brauserist paremal, näeme HTML-elementidel kerimisribasid, kus sisu ületab elemendi ja overflowatribuut (või overflow-xja overflow-y) on seatud scrollväärtusele. Ja pange tähele, et vahendite olemasolu overflow-xlisaks vertikaalsele kerimisele on meil ka horisontaalne kerimine.
Sellest me räägimegi. Mitte näitaja ise, vaid konteiner, mis seda hoiab. See on vihmaveerenn. See, kas brauser kasutab klassikalist või ülekattega kerimisriba, sõltub täielikult UAst endast. See pole meie otsustada. See kehtib kerimisriba laiuse kohta. Kasutajaagent määratleb selle ja ei anna meile selle üle kontrolli.
Sealt scrollbar-guttertuleb sisse. Saame selgitada, kas vihmaveerenn on olemas selle klassikalistes ja ülekattega variatsioonides.
Süntaks
.my-element ( scrollbar-gutter: ( auto | ( stable | always ) && both? && force? ) )Topeltmärk (&&) eraldab kaks või enam komponenti, mis kõik peavad toimuma, suvalises järjekorras.
Küsimärk (?) Näitab, et eelnev tüüp, sõna või rühm on valikuline (esineb null või üks kord).
Väärtused
auto(algväärtus): üsna palju seni kirjeldatud vaikekäitumist. Atribuudi selle väärtuse määramine võimaldab klassikalistel kerimisribadel tarbida kasutajaliideses kinnisvara elementidel, kusoverflownende elementide atribuudiks on määratudscrollvõiauto. Seevastu ülekatte kerimisribad ei võta elemendi peal istudes üldse ruumi.stableSee lisab veidi otsaga käitumist ja alati ruumi kerimisriba vihmaveerennid, nii kaua kuioverflowvara sama element on seatudscrollvõiautoja me tegeleme klassikaline kerimisriba - isegi siis, kui kui kasti ei pilgeni. Seevastu ei mõjuta see ülekatte kerimisriba.always: See toimib samamoodi,stablekuid tagab, et kerimisriba vihmaveerenni jaoks on alati ruumi reserveeritud, hoolimata sellest, kas kerimisriba on klassikaline või ülekate, ja hoolimata sellest, kas sisu on ülevoolav või mitte.both: See kinnitab, et kui kuvatakse vaikerenn, asetatakse kerimisriba renn elemendi mõlemale küljele. Näete, kuidas see võib olla kasulik, kui teie kujundus nõuab elemendi mõlemal küljel võrdset vahekaugust.forceSee on sama, rakendades niistablejaalwayskui elemendioverflowon seatudauto,scroll,visible,hiddenvõiclip.
Spetsifikaadi tööjoonisel on ülimugav tabel, mis jagab need määratlused kontekstidesse, et näidata nende suhet klassikaliste ja ülekattega kerimisribadega.
| Klassikalised kerimisribad | Keerake ribaribasid | ||||
|---|---|---|---|---|---|
| ülevoolu | kerimisriba-vihmaveerenn | Ülevoolav | Mitte ülevoolav | Ülevoolav | Mitte ülevoolav |
| kerige | automaatne | G | G | ||
| stabiilne | GM | G | |||
| alati | G | G | G | G | |
| automaatne | G | ||||
| stabiilne | G | G | |||
| alati | G | G | G | G | |
| nähtav, peidetud, klamber | automaatne | ||||
| stabiilne | f? | f? | |||
| alati | f? | f? | f? | f? | |
“G” tähistab juhtumeid, kus kerimisriba vihmaveerennile on ruumi reserveeritud “f?” juhtumid, kus jõu määramisel on ruumi kerimisribale rennile ette nähtud, ja tühjad lahtrid, kui ruumi pole.
Spetsifikatsiooni olek
scrollbar-gutterVara on määratletud Overflow Module Level 4, mis on tööversiooni staatus. See tähendab, et see on veel pooleli ja see võib muutuda praegusest hetkest, mil eelnõu kandidaatide soovitusele üle läheb.
ületäitumismooduli 3. taseme spetsifikatsioon on samuti töö mustand, seega on see hea näide sellest, et (1) soovituseks saamine võtab aega scrollbar-gutterja (2) see on endiselt väga pooleli.
Brauseri tugi
Viimase värskenduse ajal pole brauseri tuge.
Rohkem informatsiooni
- CSS-i ülevoolumooduli 4. taseme töökavand
- GitHubi väljaanne nr 92
- TPAC-i CSS-i töörühm: mida uut on CSS-is? Sealhulgas käsitsi joonistatud ettepanek tabeli jaoks, mis kirjeldab atribuutide väärtuste käitumist.