Den color-adjustegenskapen beskrivs av spec som ”konserveringsmedel färger i olika-möjlighets enheter.” Du vet hur det finns telefoner, surfplattor och andra enheter utan skärmar av näthinnakvalitet? Den här egenskapen ger webbläsaren en ledtråd för att fatta beslut om hur man hanterar färger baserat på den kvaliteten.
Du kanske tänker något i stil med: "Vänta, är inte rött bara rött?" Och ja, det är helt sant. Vad är poängen med att optimera eller justera en färg som är sant oavsett var den visas?
Poängen är att webbläsare redan tenderar att göra dessa beslut och justera färger på egen hand, som att mata ut en något annan röd om användaragenten inte kan göra en specifik hex på grund av skärmkvaliteten hos någon annan faktor. Fastigheten säger effektivt till webbläsaren, "Hej, jag skulle vilja att du använder den här färgen, men det är coolt om du inte kan och vill använda ditt bästa alternativ för situationen." Eller omvänt kan den instruera webbläsaren att exakt matcha färgen till varje pris.
Tryckta stilar
Intressant nog använder specifikationen exemplet med att skriva ut webbsidor genom hela definitionen av color-adjust. Det finns dock ingen faktisk dokumentation för att den är avsedd för utskrift. Det har inte hindrat Chrome och Safari från att implementera en prefixversion med namnet webkit-print-color-adjust, vilket är en stark indikation på att den är avsedd för utskriftsändamål.
Varför spelar det någon roll? Specifikationen beskriver ett användningsfall där det att underlätta läsbarheten att upprätthålla zebrastripning av ett formgiven bord på en tryckt sida
Till exempel kan en kartläggningswebbplats som erbjuder tryckta vägbeskrivningar ”zebra-stripa” stegen i riktningarna, växlande mellan vit och ljusgrå bakgrund. Att förlora denna zebrastripning och ha en renvit bakgrund skulle göra anvisningarna svårare att läsa med en snabb blick när de distraheras i en bil.
color-adjustär inställt på economy.
Syntax
.my-element ( color-adjust: (economy | exact); )Värden
economy(initialvärde): Detta värde gör det möjligt för webbläsaren att göra justeringar av färgen och utformningen av ett element där det bestämmer sig för det, oavsett om det är för att förbättra läsbarheten, ersätta en färg som en enhet inte kan visa eller någon annan faktor. Observera att detta är standardvärdet och även om egenskapen inte tillämpas så kommer webbläsare att bete sig.exact: Detta värde instruerar webbläsaren att matcha en färg till varje pris för att bevara den deklarerade stilen. Den skulle användas för att kalla fram stilar som är ”viktiga” eller ”betydelsefulla” för elementet.
Observera att standardanvändningen av economyhuruvida egenskapen anropas eller inte antyder att den color-adjustär utformad för att ge en signal till webbläsare som indikerar stilar som är tillräckligt viktiga för att bevara.
Specifikationsstatus
Den color-adjustegenskapen är definierad i CSS Color Module Nivå 4, som är i första offentligt Working Draft status vid tidpunkten för denna skrift. Det betyder att det ännu inte godkänns av W3C och kan uppdateras, ändras eller till och med tappas i senare versioner. Som sådan är den här egenskapen inte produktionsklar och anses vara experimentell.
Webbläsarstöd
Denna webbläsares supportdata kommer från Caniuse, som har mer detaljer. Ett nummer indikerar att webbläsaren stöder funktionen i den versionen och uppåt.
Skrivbord
| Krom | Firefox | IE | Kant | Safari |
|---|---|---|---|---|
| 19 * | 48 | Nej | 79 * | 6 * |
Mobil / surfplatta
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 81 | 14.0-14.4 |
Mer information
- CSS-färgmodul Nivå 4 Första offentliga arbetsutkast
- Microsoft Edge användningsstatistik
- MDN-dokumentation
- Möjligheterna för den färgjusterande egenskapen