Несколько запросов @media для настольных компьютеров и мобильных устройств

Хорошо, поэтому у меня есть веб-сайт, а контент в Интернете немного сложный, что означает, что мне нужно будет изменить стиль, используя @media более 3-х раз для разрешения рабочего стола, который я использую @media screen and (min-width: 1024px), @media screen and (min-width:750px) and (max-width:1049px) для рабочего стола и @media only screen and (max-device-width : 736px) для iPhone, так как iPhone 6+ ширина устройства составляет 736 пикселей.Несколько запросов @media для настольных компьютеров и мобильных устройств

Теперь мой вопрос: я все еще не могу заставить его работать, каждый раз, когда я открываю свою сеть с моего телефона, он показывает стиль рабочего стола, а не стиль iPhone.

источник

2016-02-07 Anonymous

Добавьте следующий код в ваш <head> раздел:

<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
<meta name="viewport" content="width=device-width, initial-scale=1">

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

/* Extra small devices (phones, less than 768px) */ 
/* No media query */ 

/* Small devices (tablets, 768px and up) */ 
@media (min-width: 768px) { ... } 

/* Medium devices (desktops, 992px and up) */ 
@media (min-width: 992px) { ... } 

/* Large devices (large desktops, 1200px and up) */ 
@media (min-width: 1200px) { ... }

источник

2016-02-07 16:29:12 herrh

Несколько запросов @media для настольных компьютеров и мобильных устройств

ответ

Смежные вопросы