---
title: Media Queries
localeTitle: Запросы мультимедиа
---
#### Предлагаемое чтение:

[Использование медиа-запросов - веб-документы MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries)

Также см. Раздел «Ревизионные [принципы веб-дизайна](https://github.com/freeCodeCamp/freeCodeCamp/blob/staging/seed/challenges/01-responsive-web-design/responsive-web-design.json) » на бета-версии

#### Проект статьи:

Медиа-запросы - это набор правил, определяющих свойства CSS. Вы можете настроить медиа-запросы, чтобы изменить внешний вид вашего контента на основе того, как просматривается ваш контент.

Запросы СМИ могут определять внешний вид вашего контента на разных дисплеях. Некоторые примеры различных дисплеев: изображения на экране компьютера, текст в печати или веб-страницы в звукозаписывающем устройстве.

На веб-страницах некоторые элементы могут не отображаться последовательно в разных размерах экрана. Вы можете использовать медиа-запросы для установки специальных правил для небольших и больших экранов.

Ниже приведен пример медиа-запроса, который устанавливает размер основного текста на экране телефона:

```css
@media screen and (max-width: 450px) { 
 body { 
   font-size: 12px; 
  } 
 } 
```

Этот медиа-запрос предусматривает, что для размеров экрана до 450 пикселей по ширине основной текст должен отображаться с размером шрифта 12 пикселей.

Запросы в средствах массовой информации могут быть полезны при [быстром веб-дизайне](https://guide.freecodecamp.org/html/responsive-web-design) .