Можете ли вы удалить таблицу стилей для определенного устройства? - PullRequest
3 голосов
/ 18 июля 2011

Я создаю мобильную версию сайта (не mobile.domain.com), а просто обслуживаю другую таблицу стилей, основанную на устройстве.

Итак, у меня есть что-то вроде этого:

<link href="css/style.css" media="screen" rel="stylesheet"/>
    <link href="css/mobile1.css" media="only screen and (max-width: 480px), only screen and (max-device-width: 480px)" rel="stylesheet" type="text/css" />
    <meta name="viewport" content="width = 320px, initial-scale=1" />

Моя мобильная таблица стилей, очевидно, скрывает / показывает только то, что я хочу на мобильном сайте, а затем переопределяю классы / стили в style.css.

Проблема, с которой я сталкиваюсь, заключается вКажется, я не могу найти, какой стиль я не переопределяю.То есть, если я полностью удаляю style.css - сайт выглядит идеально.Если я сохраню style.css там, это выглядит не так идеально.

Есть ли способ динамически удалить style.css при загрузке страницы?

Или я иду по этому пути совершенно неправильно.

Ответы [ 2 ]

3 голосов
/ 19 июля 2011

В итоге я просто присвоил моей таблице стилей идентификатор и сделал это:

jQuery('#mainStyleSheet').remove();

Я сделал это после проверки размера экрана. если меньше 480, я удаляю свою старую таблицу стилей. Кажется, работает довольно хорошо - хотя и не уверен, что это идеальное решение.

0 голосов
/ 19 июля 2011

Этот пример работает для Internet Explorer, но вам нужно найти правильное имя для iPhone:

<!--[if !IE]> //This will target everything except Internet Explorer browsers.
    <link rel="stylesheet" type="text/css" href="style.css"> //Add appropriate stylesheet.
<![endif]-->

<!--[if !iPhone]>
    ...
<![endif]-->

Может работать.Я не уверен, и у меня нет iPhone, чтобы проверить это.

...