color-adjustВластивість описано в специфікації , як «збереження кольору в різних пристроях-здатності.» Ви знаєте, як існують телефони, планшети та інші пристрої, які не мають екранів якості сітківки? Ну, ця властивість надає браузеру підказку для прийняття рішень щодо того, як поводитися з кольорами на основі цієї якості.
Можливо, ви думаєте щось на кшталт: "Зачекайте, чи не червоний - це просто червоний?" І так, це абсолютно вірно. Який сенс оптимізувати або регулювати колір, який відповідає дійсності, незалежно від того, де він відображається?
Справа в тому, що браузери вже схильні самостійно робити ці визначення та коригувати кольори, як-от виводити трохи інший червоний, якщо користувальницький агент не здатний відтворити певний шістнадцятковий код через якість екрану якогось іншого фактора. Властивість фактично каже браузеру: "Гей, я хотів би, щоб ти використовував цей колір, але це здорово, якщо ти не можеш і хочеш застосувати найкращу альтернативу ситуації". Або, навпаки, він може наказати браузеру точно відповідати кольору за будь-яку ціну.
Друковані стилі
Цікаво, що специфікація використовує приклад друку веб-сторінок у всьому визначенні color-adjust. Однак фактичної документації, що вона призначена для друку, немає. Це не завадило Chrome та Safari впровадити префікс-версію з назвою webkit-print-color-adjust, що є вагомим свідченням того, що вона призначена для друку.
Чому це важливо? Специфікація описує випадок використання, коли збереження смужки зебри стилізованої таблиці на друкованій сторінці може допомогти розбірливості:
Наприклад, веб-сайт для картографування, що пропонує роздруковані вказівки, може «зебра-смугувати» кроками у вказівках, чергуючи білий та світло-сірий фон. Втрата цього зебристого смугастого кольору і наявність чисто білого тла зробить маршрути важчими для читання швидким поглядом при відволіканні в машині.
color-adjustвстановлено значення economy.
Синтаксис
.my-element ( color-adjust: (economy | exact); )Цінності
economy(початкове значення): це значення дозволяє браузеру вносити корективи в колір і стиль елемента там, де він вирішує, що це потрібно, будь то для поліпшення читабельності, заміни кольору, який пристрій не здатний відображати, або якихось інших факторів. Зверніть увагу, що це значення за замовчуванням, і навіть якщо властивість не застосовано, саме так будуть поводитися браузери.exact: Це значення вказує браузеру підбирати колір за будь-яку ціну заради збереження заявленого стилю. Він би використовувався для виклику стилів, які є «важливими» або «важливими» для елемента.
Зверніть увагу, що використання за замовчуванням того, economyчи властивість викликається чи ні, передбачає, що color-adjustвоно розроблене для подання сигналу браузерам із зазначенням стилів, які є досить важливими для збереження.
Статус специфікації
color-adjustВластивість визначається в CSS Color Module Level 4, який знаходиться в першому проекті статусу громадського робочого на момент написання цієї статті. Це означає, що він ще не затверджений W3C і може бути оновлений, змінений або навіть скасований у наступних редакціях. Таким чином, це властивість не готове до виробництва і вважається експериментальним.
Підтримка браузера
Дані про підтримку веб-переглядача подані компанією Caniuse, яка містить більше деталей. Цифра вказує на те, що браузер підтримує цю функцію на цій версії та вище.
Робочий стіл
| Chrome | Firefox | IE | Край | Сафарі |
|---|---|---|---|---|
| 19 * | 48 | Ні | 79 * | 6 * |
Мобільний / планшетний
| Android Chrome | Android Firefox | Android | iOS Safari |
|---|---|---|---|
| 88 | 85 | 81 | 14,0-14,4 |
Більше інформації
- Кольоровий модуль CSS Рівень 4 Перший громадський робочий проект
- Статистика використання Microsoft Edge
- Документація MDN
- Можливості властивості налаштування кольору