CSS медиа запросы - CSS правила по умолчанию

@Oxidous · Регистрация: 03.09.2014

Author24 — интернет-сервис помощи студентам

Всем доброго времени суток,

Интересует такой вопрос: @media screen позволяют задавать определённые CSS правила для экранов с заданным разрешением. Я создал 1 медиа запрос, вида: @media screen and (min-width: 1280px) and (max-width: 1440px) and (orientation: landscape) {....} для устройств с более мелким разрешением экранов, а второй медиа запрос: @media screen and (min-width: 1500px) and (max-width: 2600px) and (orientation: landscape) {...} - для устройств с более высоким разрешением экранов.
В первом случае, CSS правила просто уменьшают размер контейнера с информацией, во втором случае - оставляют его по-умолчанию без изменений.
Интересует такой вопрос - можно ли как-то сделать так, чтоб если юзер заходит на сайт с устройства, разрешение экрана которого не подходит ни под один из этих медиа запросов, то использовались CSS правила по умолчанию? То есть такие же, как используются, допустим, во втором медиа запросе.

@mrtoxas · 28.09.2016, 16:07

CSS

body {
  background: red;
}
 
@media screen and (min-width: 1280px) and (max-width: 1440px) and (orientation: landscape){
  body {
    background: green;
  }
}
 
@media screen and (min-width: 1500px) and (max-width: 2600px) and (orientation: landscape){
  body {
    background: blue;
  }
}

@Oxidous · 28.09.2016, 18:16 **[ТС]**

Благодарю за ответ и наглядный пример. А правила по-умолчанию обязательно должны идти перед медиа запросами?

@mrtoxas · 28.09.2016, 18:20

Если вы их поставите после, они будут перебивать стили в медиазапросах

@Oxidous 4 / 4 / 1 Регистрация: 03.09.2014 Сообщений: 156
		1
	CSS медиа запросы - CSS правила по умолчанию 28.09.2016, 15:50. Показов 1998. Ответов 3 Метки нет (Все метки) Всем доброго времени суток, Интересует такой вопрос: @media screen позволяют задавать определённые CSS правила для экранов с заданным разрешением. Я создал 1 медиа запрос, вида: @media screen and (min-width: 1280px) and (max-width: 1440px) and (orientation: landscape) {....} для устройств с более мелким разрешением экранов, а второй медиа запрос: @media screen and (min-width: 1500px) and (max-width: 2600px) and (orientation: landscape) {...} - для устройств с более высоким разрешением экранов. В первом случае, CSS правила просто уменьшают размер контейнера с информацией, во втором случае - оставляют его по-умолчанию без изменений. Интересует такой вопрос - можно ли как-то сделать так, чтоб если юзер заходит на сайт с устройства, разрешение экрана которого не подходит ни под один из этих медиа запросов, то использовались CSS правила по умолчанию? То есть такие же, как используются, допустим, во втором медиа запросе. 0

@Oxidous 4 / 4 / 1 Регистрация: 03.09.2014 Сообщений: 156
	28.09.2016, 18:16 [ТС]	3
	Благодарю за ответ и наглядный пример. А правила по-умолчанию обязательно должны идти перед медиа запросами? 0

@mrtoxas 3825 / 2675 / 1521 Регистрация: 12.07.2015 Сообщений: 6,672 Записей в блоге: 4
	28.09.2016, 18:20	4
	Если вы их поставите после, они будут перебивать стили в медиазапросах 0

CSS медиа запросы - CSS правила по умолчанию

Решение