← All terms

CSS Media Queries

Also known as: Media Queries, Responsive Breakpoints

A CSS feature that allows stylesheets to apply different rules based on characteristics of the user's device or viewport, such as screen width, resolution, color capability, or user preferences like reduced motion and high contrast. Media queries are foundational to responsive web design and play an important role in accessibility by enabling designs that adapt to different devices and user needs. Accessibility-relevant media queries include prefers-reduced-motion (for vestibular disorders), prefers-color-scheme (for light/dark mode), prefers-contrast (for high contrast needs), and forced-colors (for Windows High Contrast Mode).

Category: web development · web design · web accessibility

Related: Responsive Design · Mobile Accessibility

Sources