color-adjustProprietatea este descrisă de spec ca „culori de conservare în dispozitive diferite capabilitate.“ Știți cum există telefoane, tablete și alte dispozitive acolo, fără ecrane de calitate retină? Ei bine, această proprietate oferă browserului un indiciu pentru a lua decizii despre cum să gestioneze culorile pe baza acelei calități.
S-ar putea să vă gândiți la ceva de genul „Așteptați, nu este roșu doar roșu?” Și, da, este absolut adevărat. Ce rost are optimizarea sau reglarea unei culori care este adevărată, indiferent unde este afișată?
Ideea este că browserele au deja tendința de a face aceste determinări și de a regla culorile singure, cum ar fi să scoată un roșu ușor diferit dacă agentul utilizator este incapabil să redea un hex hexagonal din cauza calității ecranului unui alt factor. Proprietatea îi spune în mod efectiv browserului: „Hei, aș vrea să folosești această culoare, dar este mișto dacă nu poți și vrei să aplici cea mai bună alternativă pentru situație.” Sau, dimpotrivă, poate instrui browserul să potrivească exact culoarea cu orice preț.
Stiluri tipărite
Destul de interesant, specificația folosește exemplul de imprimare a paginilor web pe parcursul definiției color-adjust. Cu toate acestea, nu există nicio documentație care să ateste că este destinată tipăririi. Acest lucru nu a împiedicat Chrome și Safari să implementeze o versiune prefixată numită webkit-print-color-adjust, ceea ce este un indiciu puternic că este destinat imprimării.
De ce contează asta? Specificația descrie un caz de utilizare în care menținerea benzii zebra a unei mese stilizate pe o pagină tipărită ar putea ajuta la lizibilitate:
De exemplu, un site web de cartografiere care oferă indicații de orientare tipărite ar putea „înfășura zebra” pașii din direcții, alternând între fundaluri albe și gri deschis. Pierderea acestui zebră și un fundal alb pur ar face ca direcțiile să fie mai greu de citit cu o privire rapidă atunci când sunt distrase într-o mașină.
color-adjusteste setată la economy.
Sintaxă
.my-element ( color-adjust: (economy | exact); )Valori
economy(valoare inițială): această valoare permite browserului să facă ajustări la culoarea și stilul unui element în cazul în care decide că trebuie, fie pentru a îmbunătăți lizibilitatea, pentru a înlocui o culoare pe care un dispozitiv este incapabil să o afișeze sau pentru un alt factor. Rețineți că aceasta este valoarea implicită și, chiar dacă proprietatea nu este aplicată, așa se vor comporta browserele.exact: Această valoare instruiește browserul să potrivească o culoare cu orice preț pentru a păstra stilul declarat. Ar fi folosit pentru a numi stiluri care sunt „importante” sau „semnificative” pentru element.
Rețineți că utilizarea implicită a economyproprietății este sau nu apelată sugerează că color-adjusteste conceput pentru a oferi un semnal browserelor care indică stiluri suficient de importante pentru a fi păstrate.
Starea specificațiilor
color-adjustProprietatea este definită în CSS Color Module Level 4, care este în primul proiect de stare de lucru public la momentul scrierii. Acest lucru înseamnă că nu este încă aprobat de W3C și ar putea fi actualizat, modificat sau chiar eliminat în reviziile ulterioare. Ca atare, această proprietate nu este pregătită pentru producție și este considerată experimentală.
Suport pentru browser
Aceste date de asistență pentru browser provin de la Caniuse, care are mai multe detalii. Un număr indică faptul că browserul acceptă funcția în versiunea respectivă și în sus.
Desktop
| Crom | Firefox | IE | Margine | Safari |
|---|---|---|---|---|
| 19 * | 48 | Nu | 79 * | 6 * |
Mobil / Tabletă
| Android Chrome | Android Firefox | Android | Safari iOS |
|---|---|---|---|
| 88 | 85 | 81 | 14.0-14.4 |
Mai multe informatii
- CSS Color Module Nivelul 4 Primul proiect public de lucru
- Statistici de utilizare Microsoft Edge
- Documentația MDN
- Posibilitățile proprietății de ajustare a culorii