Медиа-запросы на выбор разных 960 гс - PullRequest
0 голосов
/ 01 декабря 2011

Я использую следующий код ниже, чтобы выбрать различные файлы CSS в зависимости от размера окна моего браузера.Однако первый из них, кажется, не работает, когда я изменяю размер окна до такого размера, даже если я обновляю страницу.Я не уверен, что я должен делать, чтобы это исправить.Спасибо.

@import url("css/960.css") screen and (max-device-width: 1200px);
@import url("css/2520.css") screen and (max-device-width: 2560px);

1 Ответ

3 голосов
/ 01 декабря 2011

Догадываюсь здесь, но я не думаю, что это сработает, потому что вы используете max-device-width, а не max-width.

device-width - это виртуальные пиксели, которые может отображать устройство.

Ширина устройства (Mozilla) - Описывает ширину устройства вывода (то есть весь экран или страницу,
а не только область рендеринга, например окно документа).

Не думаю, что вы можете подделать это, изменив размер окна браузера.

max-width с другой стороны - это измерение фактического окна просмотра, отображаемого в браузере.

Ширина (Mozilla) - Функция ширины носителя описывает ширину поверхность рендеринга устройства вывода (например, ширина окно документа, или ширина окна страницы на принтере).

То есть, вы можете использовать max-width:

@import url("css/960.css") screen and (max-width: 1200px);
@import url("css/2520.css") screen and (max-width: 2560px);

или попробуйте использовать какой-нибудь симулятор устройства, например симулятор iPad, или реальное устройство, чтобы проверить, правильно ли работают ваши медиазапросы.

...