Можно ли удалить таблицу стилей для определенного устройства?

Я создаю мобильную версию сайта (не 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 при загрузке страницы?

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


person Jack Marchetti    schedule 18.07.2011    source источник
comment
media="handheld" вам не подходит?   -  person Chad    schedule 18.07.2011
comment
media=handheld не работает на iPhone   -  person Jack Marchetti    schedule 18.07.2011
comment
Возможно, вы захотите пометить этот iphone, тогда это тоже может помочь.   -  person Chad    schedule 18.07.2011


Ответы (2)


Я закончил тем, что просто дал своей таблице стилей идентификатор и сделал это:

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

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

person Jack Marchetti    schedule 19.07.2011
comment
Ну а чем iPhone себя позиционирует, как не карманным? (Я не знаю, так как я не мобильный разработчик, но если он сообщает о себе как о чем-то отдельном, вы можете использовать это.) - person Zéychin; 19.07.2011
comment
сообщает о себе как Screen. В конечном итоге вам придется использовать медиа-запросы - person Jack Marchetti; 19.07.2011
comment
Ой. Что ж, я попробовал, не будучи мобильным разработчиком, я не знал ничего лучшего. Желаю тебе удачи! - person Zéychin; 19.07.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, чтобы проверить это.

person Zéychin    schedule 19.07.2011