From the course: Advanced CSS Media Queries

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Targeting specific devices using complex media queries

Targeting specific devices using complex media queries - CSS Tutorial

From the course: Advanced CSS Media Queries

Start my 1-month free trial

Targeting specific devices using complex media queries

“

- [Narrator] One of the really interesting things about these new kinds of media queries is the ability to detect specific devices. And Riccardo Andreatta, hopefully I've said his name correctly, wrote this great article on Medium about detecting a touch device using only CSS. In his article, he is going to explain exactly how the hover feature works, the pointer feature. These are things I've already explained to you. Then about halfway through the article, he will show you how you can combine various kinds of hover and pointer media queries to detect certain devices. So for example, to start here for smartphones and touch screens, we can set the hover state to none and the pointer to coarse. So, in other words, a phone, of course, has no hover state. And since you're going to use your finger as a pointer, the combination of those two media queries should indicate that you're working with a phone or probably a tablet. If…

Contents