Разные CSS для разных браузеров
Из-за разных интерпретаций HTML и CSS разными браузерами (в результате чего в одном браузере все красиво, а в другом — все разломано), иногда приходится подсовывать для каждого браузера (чаще для IE) отдельный файл со стилями. Обычно должено помогать объявление
<DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
но и эта строчка иногда оказывается «бессильной». И так, для разделения стилей для браузеров можно использовать 2 способа:
- Которым я НЕ пользуюсь:
Делаем 2 разных файла CSS в котором используются одинаковые названия классов стилей. В HTML странице сначала объявляется CSS для Opera, Firefox и Safari:
<link rel="stylesheet" href="/allstyles.css" type="text/css" />
Затем, пишем Vbscript, который работает только в Internet Explorer:
<script language="vbscript">
document.write("<link rel=""stylesheet"" href=""/IEstyles.css"" type=""text/css"" /> ")
</script>
Бразуеры Opera, Firefox и Safari не смогут выполнить этот код и пропустят, а IE выполнит и подключит оба CSS файла, но при обрабатывании класса, будет руководстоваться сначала вторым CSS (который подключен с помощью VBScript), и, если такой класс не описан, то первым (который жестко прописан в HTML
- Этим способом я пользуюсь:
Так же делаем 2 разных файла CSS в котором используются одинаковые названия классов стилей. Затем в HTML странице используем JavaScript:
<script language="javascript" type="text/javascript">
if ((navigator.userAgent.indexOf("MSIE")) >= "0")
{
document.write("<link rel=stylesheet href=/iestyle.css type=text/css />");
}
else
{
document.write("<link rel=stylesheet href=/allstyle.css type=text/css />");
}
</script>
Как это работает?
Можете создать пустую HTML страницу со скриптом:
и открыть его разными браузерами. Строка UA будет указывать версию браузера и операционной системы, строка index — положение слова MSIE в строке. В IE index покажет «25». в остальных браузерах «-1» (это слово в строке UserAgent отсутствует). В предыдущем скрипте (во втором способе) идет проверка как раз на MS Internet Explorer.
К сожалению, ни один из этих способов не сработает на браузере в котором отключены скрипты ;-)
Спасибо за подробные разъяснения, статья реально помогла в вопросе кросбраузерных сайтов!
Теперь хоть более понятно в каком направлении дальше искать инфу...
Неплохо неплохо, будем изучать.
Я обычно верстаю в трех браузерах одновременно, стараюсь кроссбраузерности добиться в самом HTML, в исключительных случаях применяю CSS-хаки, но это когда просто нет другого выхода.
Я только начинающий поэтому огромное спасибо за инфу.
Интересная информация.
А как подключить стили в Wordpress?
Подскажите, пожалуйста.
Описаным способом не получилось.
Спасибо!
Мила
Really a great article and its easy to see that you didnt just copy it!