KandZ – Tuts

We like to help…!

CSS 35 💻 forced-colors and grid media features

a - forced-colors media feature
forced-colors applies styles when the user agent has enabled forced colors mode
An example of forced colors mode is High Contrast mode in Windows
Values: none and active
box-shadow, text-shadow, background-image are forced to none
color-scheme is forced to light dark and scrollbar-color is forced to auto
color, background-color, text-decoration-color, text-emphasis-color, border-color, outline-color...
... and column-rule-color use browser-specified values
@media (forced-colors: active) → applies style when forced-colors mode is enable

b - grid media feature
grid feature checks whether the output device uses a grid-based screen
values: 0 or 1, 1 uses a grid-based screen
Computer and smartphones have bitmap-based screens
Text-only terminals and simple phones are grid-based
@media (grid: 0) → applies styles to normal devices (computers and smartphones)
@media (grid: 1) → applies styles to grid-based devices

Leave a Reply