CSS-правило @media

Правило @media можно использовать для определения стилей для нескольких типов мультимедиа в одной таблице стилей. После объявления @media должен следовать разделенный запятыми список типов мультимедиа и блок, содержащий правила.

Синтаксис

Синтаксически правило задается по следующему шаблону:

@media media type,... {
    /* media-specific rules */
}

Примеры написания кода правила @media:

@media screen{
    body {
        color: #32cd32;
        font-family: Arial, sans-serif;
        font-size: 14px;
    }
}
@media print {
    body {
        color: #ff6347;
        font-family: Times, serif;
        font-size: 12pt;
    }
}
@media screen, print {
    body {
        line-height: 1.2;
    }
}

Поддержка браузеров

Правило @media поддерживается во всех основных браузерах.