Применить правила CSS, если браузер IE [дубликат]
4 ответа
В браузерах до IE9 включительно это делается через условные комментарии.
<!--[if IE]>
<style type="text/css">
IE specific CSS rules go here
</style>
<![endif]-->
Быстрый подход - использовать следующее в зависимости от того, что вы хотите сфокусировать (проверьте комментарии) внутри ваши файлы css (где margin-top, установите любой атрибут css, который вам нравится):
margin-top: 10px\9; /*It will apply to all ie from 8 and below */
*margin-top: 10px; /*It will apply to ie 7 and below */
_margin-top: 10px; /*It will apply to ie 6 and below*/
Лучшим подходом было бы проверить пользовательский агент или условное if, чтобы избежать загрузки ненужного CSS в других браузерах.
Я предпочитаю использовать отдельный файл для правил, как описано ранее.
<!--[if IE]><link rel="stylesheet" type="text/css" href="ie-style.css"/><![endif]-->
И внутри него вы можете установить правила для разных версий, например, используя это:
.abc {...} /* ALL MSIE */
*html *.abc {...} /* MSIE 6 */
*:first-child+html .abc {...} /* MSIE 7 */
Хороший способ избежать загрузки нескольких файлов CSS или иметь встроенный CSS — передать класс тегу body в зависимости от версии Internet Explorer. Если вам нужны только общие хаки IE, вы можете сделать что-то вроде этого, но это может быть расширено для конкретной версии:
<!--[if IE ]><body class="ie"><![endif]-->
<!--[if !IE]>--><body><!--<![endif]-->
Теперь в вашем коде CSS вы можете просто сделать:
.ie .abc {
position:absolute;
left:30;
top:-10;
}
Это также сохранит ваши файлы CSS действительными, так как вам не нужно использовать грязные (и недействительные) хаки CSS.