Rullepanel-farve - CSS-tricks

Den scrollbar-coloregenskab styrer de to farver af en scrollbar: den tommelfinger farve og sporet farve . scrollbar-colorer en del af CSS-arbejdsgruppens Scrollbars-modul niveau 1-udkast, som stadig er i gang med at blive skrevet.

Forud scrollbar-colorhavde udviklere ingen standard måde at ændre standardudseendet på en browsers rullebjælker uden at ty til at skjule rullebjælken via overflow: hiddenog gengive JavaScript-baserede rullebjælker eller bruge browser-præfikserede rullebjælkeattributter. På scrollbar-colorden anden side kan vi style en rullebjælke, så den matcher et design uden at ty til at gentage browserfunktionalitet eller bruge leverandørpræfikser.

.scrollable-element ( scrollbar-color: red yellow; )

scrollbar-coloraccepterer også værdier for darkog lightmatcher en brugers præferencer, hvis de bruger noget som mørk tilstand på Mac OSX.

.scrollable-element ( scrollbar-color: dark; )

Fra marts 2019 er support til darkog lightværdier ikke tilgængelig i nogen browser. understøttes i Firefox. Se afsnittet om browsersupport nedenfor for detaljer.

Syntaks

scrollbar-color: auto | dark | light | ;

Værdier

scrollbar-color accepterer følgende værdier:

auto er standardværdien og gengiver standardrullelinjens farver for brugeragenten.
dark vil fortælle brugeragenten at bruge mørkere rullepaneler til at matche det aktuelle farveskema.
light vil fortælle brugeragenten at bruge lettere rullepaneler til at matche det aktuelle farveskema.
angiver to farver, der skal bruges til rullepanelet. Den første farve er til "tommelfingeren" eller den bevægelige del af rullepanelet, der vises øverst. Den anden farve er til “sporet” eller den faste del af rullepanelet.