Всеми обожаемый Internet Explorer не понимает Ваш ультрасовременный CSS3 со всеми передовыми фишками? Вам нужен какой-то метод лечения? Используйте условные комментарии на Ваших проектах, с помощью которых, Вы сможете указать всей линейке браузера IE или каждой его версии по отдельности, свои стили CSS.
Для любителей поорать, что это боян и старое, как мир, попрошу воздержаться. Не все такие умные, как Вы.
Примеры комментариев для всех версий IE
Данные комментарии включаются в HTML-страницу и выглядят следующим образом:
Пример 1.
Можно сразу в комментариях прописать определенные CSS-правила для Internet Explorer, если этих правил немного:
<!--[if IE]> <style type="text/css"> #container { width:100%; margin:0 auto; padding:0; } </style> <![endif]-->
Пример 2.
Если же у вас получился большой листинг, Вам будет проще создать отдельный CSS-файл и в условных комментариях сослаться на него:
<!--[if IE]> <link rel="stylesheet" href="ie.css" type="text/css" /> <![endif]-->
Таким образом, когда пользователь зашел на Ваш сайт с Internet Explorer-а (любой версии), все стили будут подгружаться с указанного в условных комментариях CSS-файла (Пример 2) или будет руководствоваться теми правилами, которые прописаны в комментариях (Пример 1).
Примеры комментариев для некоторых версий IE
Наверное, Вас интересует вопрос: "а можно ли для определенной версии IE прописать свои стили?". Естественно!
Пример 3.
Указываем правила только для Internet Explorer 8:
<!--[if IE 8]> <link rel="stylesheet" href="ie.css" type="text/css" /> <![endif]-->
Пример 4.
Указываем правила только для Internet Explorer 7:
<!--[if IE 7]> <link rel="stylesheet" href="ie.css" type="text/css" /> <![endif]-->
Пример 5.
Указываем правила только для Internet Explorer 6:
<!--[if IE 6]> <link rel="stylesheet" href="ie.css" type="text/css" /> <![endif]-->
Ниже, я думаю, опускаться не имеет смысла. Предполагаю, что тактика понятна.
Примеры коммент. для всех браузеров, кроме IE
Иногда бывают такие ситуации, когда один и тот же блок нужно по разному загружать в IE и в нормальных браузерах и при этом правила CSS не спасают. Вот такие комментарии Вам в этом и помогут. Мне, по крайней мере, помогли в одной из моих работ.
Пример 6.
<!--[if !IE]><!--> <link rel="stylesheet" href="ie.css" type="text/css" /> или HTML-разметка <!--<![endif]-->
Операторы условных комментариев
Также можно использовать специальные операторы в комментариях:
- lt - ниже;
- gt - выше;
- lte - ниже или равно;
- gte - выше или равно;
- ! - отрицательный оператор.
Примеры операторов
Пример 7.
Правила сработают для всех версий IE, которые ниже 6-й версии:
<!--[if lt IE 6]> <link rel="stylesheet" href="ie.css" type="text/css" /> <![endif]-->
Пример 8.
Правила сработают для всех версий IE, которые выше 6-й версии:
<!--[if gt IE 6]> <link rel="stylesheet" href="ie.css" type="text/css" /> <![endif]-->
Пример 9.
Правила сработают для 6-й версии IE и всех, что ниже:
<!--[if lte IE 6]> <link rel="stylesheet" href="ie.css" type="text/css" /> <![endif]-->
Пример 10.
Правила сработают для 6-й версии IE и всех, что выше:
<!--[if gte IE 6]> <link rel="stylesheet" href="ie.css" type="text/css" /> <![endif]-->
Пример 11.
Правила сработают для всех, кроме 6-й версии IE:
<!--[if ! IE 6]> <link rel="stylesheet" href="ie.css" type="text/css" /> <![endif]-->
Другие возможности
С помощью данных комментариев можно не только указывать собственные стили для IE, но и выводить блоки или сообщения для пользователей Internet Explorer. Наглядный пример, мой проект - Art-Stream. Решение нашел тут + немного изменил и поменял иконки с ссылками.
В итоге: с помощью условных комментариев, я указал, чтобы всем пользователям IE, которые зашли на сайт, выводилось сообщение, что их браузер устаревший и возможно некорректное отображение элементов на сайте, также предложил скачать любой из современных браузеров.
Скриншот кликабельный
Естественно, есть разные решения, как выводить подобные "алерты", но я выбрал такой способ. Весьма удобный и простой.
Надеюсь, сегодняшняя информация Вам когда-нибудь пригодиться А те, кто знают, те молодцы)
Не сильны в программировании, но нужен сайт? Доверьте это дело людям, которые хорошо знают, что такое разработка сайтов.
[...] This post was mentioned on Twitter by Anna Volkova, Diamaxx. Diamaxx said: Условные комментарии для Internet Explorer: Всеми обожаемый Internet Explorer не понимает Ваш ультрасовременный… http://bit.ly/g8vhl1 [...]
Ай-вэй, какой ужас весь этот CSS!
Тут больше HTML)))
Мне жаль тех людей, которые пользуются старым ослом, но из принципа не делаю ничего под осла. Пока не попадалось клиентом с клиническим не пониманием слов фаерфокс, опера или хром.
Олег, молодец что написал этот пост, добавил в закладки. Не ровен час — придут и ко мне, любители всяких разных с латексом и шариками
Заказчики то не пользуются, но вот их клиенты, которые заходят на их же сайты – могут)))
Спасибо! Поменьше тебе таких любителей!
Надо наверное из всех правил ввести одно: запретить вообще отображать сайты при пользовании этим недобраузером. )) Не могу сказать, что я совсем игнорирую его при верстке, но так хочется навсегда забыть о его существовании! Даже если закрыть глаза на его своеобразную интерпретацию отображения страниц, то его любимое окно: “Программа выполнила недопустимую операцию и будет закрыта” реально ведь достает и самих пользователей! Так нет же! Как медом намазано. Не заставишь поменять туроператора даже этим! )))
В некоторых компаниях у людей просто нету выбора, только ИЕ в пакете от Мелкософта.
Блин, и не говорите. Нафиг этот IE.
Приходится ручками подчищать.
Chrome рулит