|
|
|
 |
| Правильные таблицы стилей | |
 |
|
|
|
"Тяжела и неказиста..." Вобщем, трудно быть разработчиком html, когда основные игроки на рынке браузеров интерпретируют рекомендации W3C так, как им заблагорассудится. Я уверен, что вы уже сотню раз встречались с тем, что правильно показываемый в Internet Explorer код, выглядит абсолютно "криво" в Netscape Navigator. |
|
|
Простой пример. Если вы напишете следующее на своей странице:
<STYLE TYPE="text/css">
BODY {
font-family: helvetica;
}
</STYLE>
...
<TABLE BORDER=1>
<TR><TD>Текст в таблице</TD></TR>
</TABLE>
То результаты в Netscape Navigator и Internet Explorer будут несколько непохожи друг на друга:
 |  | | Internet Explorer | Netscape Navigator |
|
В первую очередь, в глаза бросается то, что гарнитуры разные! Попробуем это исправить, добавив в стили следующее правило:
TD {
font-family: helvetica;
}
Теперь вроде стало по-лучше.
 | | Netscape Navigator после изменений |
|
В данном случае не составляет труда внести изменения в таблицу стилей. Но при создании большого, серьезного сайта, таких изменений может быть сотни. Причем, значение, правильное для Netscape Navigator может полностью исказить картинку в Internet Explorer. Что же делать? Я не советую вам применять метод насильственного насаждения своего любимого браузера посетителям вашего сайта, так как вы им, гораздо менее дороги, чем любимая бродилка. Жестко? Что делать, зато правда.
Есть гораздо более красивое решение этой проблемы. Из скрипта мы можем достоверно определить каким браузером просматривается страница. Сделать это можно так:
<SCRIPT TYPE="text/javascript">
if (navigator.appName.indexOf("Explorer") >= 0) {
document.write('<LINK REL=stylesheet HREF="explorer.css"' +
'TYPE="text/css">');
}
else {
document.write('<LINK REL=stylesheet HREF="navigator.css"' +
'TYPE="text/css">');
}
</SCRIPT>
Таблицы стилей будут выглядеть следующим образом:
; navigator.css
BODY {
font-family: helvetica;
}
TD {
font-family: helvetica;
}
; explorer.css
BODY {
font-family: helvetica;
}
Таким образом мы раздали каждому браузеру, причитающуюся ему таблицу стилей. Казалось бы, можно вздохнуть с облегчением, но есть и другие браузеры. Из самых распространенных - Opera (кстати, очень хороший браузер, влезающий на дискету. И, по последним данным, поддерживающий рекомендации W3C на 78%, что в несколько раз превышает такие значения для IE и NN). Этот подлый враг веб-мастера (версия 3.6b3) скрывается под личиной Netscape Navigator версии 3.0. Как определить, что это именно Опера и подсунуть ему нужную таблицу стилей я не знаю :( Если кто-то знает - напишите.
Перейти к рубрике --> CSS |
|
|
