Скрытие CSS от браузеров. @import
В подавляющем большинстве случаев лично мне хватает переключения IE6 в Quirks Mode и использования хаков html>body
и html:root
. Всё в одной таблице стилей.
Но иногда «хочется странного».
Если стоит задача выдать группе бродилок определённый CSS, то можно пойти таким путём:
<link rel="stylesheet" type="text/css" href="all.css" />
<!-- для всех браузеров, включая NN4 -->
<style type="text/css">
@import url("style.css");
/* NN4 этого уже не увидит. */
/* Или (если хотим убрать NN4 и IE4): */
@import "style.css";
/* Ну а теперь то, что доктор прописал: */
@import url("morden.css");
/* ... или как-то иначе. */
</style>
Собрано в одну таблицу по нисходящей. Сначала идут полностью валидные вещи, потом стили, которые валидатор принимает, но с руганью, и совсем «никудышные».
Хотелось бы заметить, что проверка на взаимодействие таких записей между собой в окончательном варианте лишней не будет. Например, Опера не станет загружать не только "style1.css", но и "style2.css", что не соответствует таблице:
<style type="text/css">
@import ur\6C ("style1.css");
/* Здесь Опера «сломалась» */
/* и дальше уже ничего не увидит. */
@import url("style2.css");
body { font-size: 2em; }
</style>
<style type="text/css">
/* А это увидит: */
@import url("style3.css");
body { font-size: 1em; }
</style>
Интересовали ошибки в парсерах браузеров. Если у кого-нибудь завалялся IE4 — велкам. От помощи с Safari тоже бы не отказался.
Categories: CSS | comments: (9)
Комментарии
1. РезиновыйЗапаЛ 3rd May 2004 - 05:32
А проще?
Для загрузки под IE 4.0+ используем:
<style type="text/css">@import:url(formsie.css);</style>
Если не IE — используем:
<link rel="stylesheet" type="text/css" href="all.css" />
и хакнутые внутренние стили.
Mash:
1) А смысл? И "formsie.css", и "all.css" увидят все браузеры (только NN4 не увидит "formsie.css"). Иногда проще подсунуть другой стиль, а не хакать внутри одного.
2) Я не говорю, что это единственный вариант. Меня больше интересовало «загибание» парсеров.
update: пардон, поторопился. "formsie.css" применит только IE, да.
Но. Если я, грязный извращенец, вдруг захочу IE6+Mozilla? :)
2. kukutz 3rd May 2004 - 10:20
Так ты через энтити типа @ expression как-то пропихнул?
Или мне приснилось, что ты говорил, что нашёл новый способ? =)
Mash:
Странно, я же тебе мыло ещё 28 апреля отправлял. Не получил?
<a style="width:expression(alert(1))">test</a>
<a href="#" style="border:10px s\6F lid #333">test</a>
и т.д.
IE, Mozilla.
3. kukutz 3rd May 2004 - 14:45
Не получал, ага.
Спасибо большое.
Mash:
Интересно, мой сегодняшний ответ по поводу амперсанда дойдёт или опять глюкнет?
4. ganges 5th May 2004 - 19:03
Да, сколько людей, столько и методов, простите, «отдрочки» ненужных клиентов
Странно, а зачем Вам что-то прятать от ИЕ4?
я прячу импортом стиль (весь!) от НН4 — он получает семантически структурированный аштээмэль, дальше в очень редких случаях использую «тантэк хаки», а в основном «играюсь» с иксэмэль прологом и использую селекторы типа html> body#content {нормальные значения;} и нет проблем пока
правда я верстаю в основном в 2 колонки (третью, если надо флоачу вправо)
Я вынужден использовать ИЕ 5.0 как минимальный «целевой» браузер — так что все проблемы в основном с ним (и с ИЕ 5.2 МАС)
А Сафари мне где-то эмулятор встречался — сервис — ты в него урлу — он в тебя — скриншот :)
Mash:
Это просто пример. Сам я от IE4 стили не прячу. Пускай смотрит — мне не жалко.
С другой стороны, IE4 такой же динозавр, как и NN4. Почему бы и ему не отдавать «академический» дизайн?
Про Safari знаю, но тридцать пикчеров тягать не хотелось. Придётся, наверное.
5. Julik 8th May 2004 - 00:51
Сделаю тебе тесты в Сафари к среде, но ты бы оформил эту штуку в виде PHP-скрипта со страницами. Тогда можно было бы легко тестить.
А так — супер, супер, супер.
Mash:
Эх, где же ты раньше был? Я для Safari 1.2 сделал, просто пока ещё не выкладывал. С другой стороны, проверка не помешает, потому как проверял через icapture, большие картинки не грузил, смотрел по превьюшкам. Вполне мог что-нибудь пропустить.
В этой редакции понимает 1-4, 7-9, 29. Менять пока там ничего не буду. Сверим часы? :)
>> но ты бы оформил эту штуку…
А что не так? Кликнул по цифре — получил страницу с указанным @import. Если хочется гонять локально — качаешь zip, открываешь css_import.html, тестируешь.
6. Julik 8th May 2004 - 02:08
Это все упрощает. Usability-проблема — я не мог даже подумать, что по номерам можно кликать и эта страничка сама по себе Test Suite.
Проверил, все точно. Кстати, захаживай, у нас темы пересекаются несколько.
Mash:
Ага. Сижу, читаю.
7. Mae 18th March 2005 - 22:06
Stranno, no moi IE 6.0.2900.2180 na XP Pro ne prinimayet
@import «myStyle.css»; (rule 4).
Eto ya tak, dlya sbora informatzii soobshayu.
D
8. Mae 18th March 2005 - 22:21
Izvinite staruyu. Ya'j na rule 4 jmu a chitayu rule 3! Ob'yasnyayu otsutstviyem sna…
9. Chiranjeev Kumar 4th August 2007 - 01:48
Hi,
Very nice
Regards
Chi