Как работает @media ?

Question

[Anton Yatsenyuk]

В чём разница между таким объявлением:

@media (max-width: 768px) {
    .content {
        width: 500px;
    }
}

и таким:

@media screen and (max-width: 768px) {
    .content {
        width: 500px;
    }
}

Answer 1

[Евгений Петров]

Неуказанный тип означает all:

@media (max-width: 768px) {...}
@media all and (max-width: 768px) {...}

Answer 2

[Павел Мышкин]

Второе только для экранов мониторов. Не будет применятся на телевизорах, проекторах, при печати, смартфонах (ios и android 100% пофиг на handled).