2010-11-05 4 views
2

У меня вопрос о практике кодирования CSS. IE часто требует хаки или обходные пути, чтобы получить вещи смотрит прямо, и есть два различных способа делать вещи:альтернативные листы CSS для IE?

  1. Поместите все в один большой файл CSS
  2. Создайте два CSS файлов и иметь его загрузки в зависимости от браузера что пользователь использует

Я думаю, что второй имеет больше смысла, но есть ли основания не делать этого? Что более распространено?

ответ

2

Единственный аргумент против двух файлов CSS заключается в том, что при первом открытии вашей страницы он будет генерировать один дополнительный HTTP-запрос.

Однако, как только кеш браузера будет заполнен локальной копией этих файлов, эта проблема будет удалена.

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

+0

Wow, downvote? Было бы неплохо услышать некоторые аргументы о том, что именно не так с моим ответом. –

+0

У кого-то было слишком много резервов, очевидно :) –

+0

Забавный, хотя, голос голосования ушел сейчас. Я подозреваю, что кто-то пытался временно перевести свой ответ на вершину, чтобы поймать некоторые глазные яблоки. :-) –

1

Я думаю, что нет причин не делать второй. Выражение, подобное <!--[if IE]>, стоит удостовериться в том, что надлежащий css загружен и сэкономит пропускную способность при использовании браузера, отличного от ie.

1

Единственный аргумент, который может быть сделан для отдельной таблицы стилей, - это сокращение одного HTTP-запроса. Учитывая, что в среднем 60% веб-трафика будет сделано из пользователей IE, это не оказывает незначительного влияния.

Однако хаки, такие как Холли Хак, просто уродливы и не гарантируют работу, и что, поскольку таблицы стилей кэшируются, воздействие не должно быть таким значительным, как это было бы. Условные комментарии являются приемлемой практикой и должны использоваться для решения проблем IE. Нет никакой причины загружать два полностью отдельными таблицами стилей только для стандартных совместимых и нестандартных редакторов жалоб - переопределения нескольких проблемных свойств должно быть достаточно.

В качестве альтернативы, решение Javascript, такое как IE7.js, также может использоваться для того же эффекта.

1

Я использую либо, это просто зависит от того, сколько изменений требуется, чтобы страница выглядела правильно в IE.

Если это небольшое изменение, так как элемент должен быть 500 пикселей в IE, а не 480 пикселей, чем использовать обходной путь в моей таблице стилей.

Но если есть многочисленные изменения, я иду с условными комментариями для загрузки отдельной таблицы стилей, если это IE, но с этим у меня нет двух копий одной таблицы стилей, одна из которых закодирована для других браузеров и одна кодируется для IE , У меня он ВСЕГДА загружает мою основную таблицу стилей, затем при необходимости загружает таблицу стилей IE и меняет только те элементы, которые ей нужны (поэтому нет необходимости дублировать в таблице стилей, чтобы сократить размер файлов)

В принципе, как я это делаю это:

пара элементов нуждается в изменении: придерживаться обходных

много элементов необходимо изменить: использовать условные комментарии

2

Мое предпочтение как стандарт для всех проектов - использовать один файл CSS, поэтому его легче управлять и изменять позже (также только один HTTP-запрос). Затем используйте условные обозначения, чтобы изменить класс тела.

<!--[if lt IE 7 ]> <body class="ie6"> <![endif]--> 
<!--[if IE 7 ]> <body class="ie7"> <![endif]--> 
<!--[if IE 8 ]> <body class="ie8"> <![endif]--> 
<!--[if IE 9 ]> <body class="ie9"> <![endif]--> 
<!--[if (gt IE 9)|!(IE)]><!--> <body> <!--<![endif]--> 

Не уверен, как часто это, но он также используется в HTML5Boilerplate

0

Вы можете быть в состоянии получить все заработало право без браузера «писаки».

По возможности избегайте использования CSS-браузера. Для более старых версий IE я предпочитаю использовать условные комментарии <--[if IE...]> ... <[endif]-->.

Я знаю, что они создают другой запрос на сервер, но, по моему мнению, любой, кто достаточно глуп, чтобы использовать устаревшую версию (6 или меньше), не заслуживает того, что потребуется несколько миллисекунд для загрузки другая таблица стилей. Это также позволяет мне централизовать исправления.

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

0

Поместите в файл CSS IE только то, что вам нужно для исправления макетов в IE, а не для совершенно новой (и, возможно, дублированной) таблицы стилей.

Я также рекомендую это для импорта javascript, как быстрый скрипт для работы элементов HTML5 (этот я видел на примере Remy Sharp на whatwg, если я не ошибаюсь).

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