Практика разработки Web-страниц
         

Стили не работают в определенном броузере


Cтандарт CSS разработан давно, но броузеры медленно реализовывают его. Если некоторые ваши пользователи имеют не самые последние версии броузеров, они не увидят ваши настройки стиля. Еще хуже, если броузер некорректно интерпретирует их и сделает вашу страницу непохожей на то, что вы ожидали. Например, Netscape 4 поддерживает многие свойства стилей, но их реализация может оказаться весьма неожиданной.


увеличить изображение
Таблица стилей, прикрепленная к странице, работает как надо в Internet Explorer. В Netscape все срывается, абзацы оказываются слишком далеко друг от друга, а маркеры не появляются!

Простого решения этой проблемы нет, но существует несколько стратегий, которым вы можете следовать. Для общей информации см. "Поддержка броузера для CSS". Если ваши стили работают не во всех броузерах, сделайте следующее.

  1. Проверьте вашу страницу в новейшем броузере, таком как Internet Explorer 5, или еще более новом. Если стили не работают, ошибки, скорее всего, в вашей таблице стилей или HTML – или же вы используете настолько новые возможности, что их не поддерживает пока ни один броузер.

    Большинство пользователей имеют Internet Explorer 5, который поддерживает практически все стандарты CSS. Ваши стили должны начать работать в этом броузере – только потом есть смысл проверять их в других броузерах. (См. "Стили работают некорректно").

  2. Для других броузеров выберите одну из следующих стратегий:

    • Если ваш стиль работает в 5-й версии броузеров, но выглядит неплохо и в других, можно не волноваться о менее популярных броузерах. (Пользователи усовершенствуют свое программное обеспечение, и проблема исчезнет).
    • Вы можете использовать одну таблицу стилей и одну настройку веб-страниц для поддержки всех броузеров, ограничив таблицу стилей тэгами и свойствами, которые имеют наибольшую поддержку. Если вы хотите, чтобы таблица стилей работала постоянно через броузеры, поддерживающие CSS, используйте такие свойства стилей: background, color, font-family, font-size, font-style, font-weight, line-height, text-align, text-decoration.
    • Вы можете разработать свою веб-страницу со своей собственной таблицей стилей для каждого броузера. Так можно адаптировать CSS и HTML для каждого броузера, не заботясь о совместимости, но такое решение потребует много работы по поддержке страниц. Можно использовать сценарий на стороне сервера, чтобы определить, какую версию броузера пользователь использует, и послать правильную страницу. (См. "Выбор программирования на стороне клиента или на стороне сервера").




    • Вы можете использовать одни и те же веб-страницы, но сложную таблицу стилей. Например, вы можете создать таблицу стилей для каждой популярной версии броузера или создать одну таблицу стилей для Netscape 4, а другую – для всех других броузеров. Для старых броузеров используйте простые стили. В секции <HEAD> вашего файла используйте JavaScript, чтобы обнаружить броузер и подключить правильную таблицу стилей:

      <script language="JavaScript "type="text/javascript"> <!--//Link to stylesheet -special version for Netscape 4. var cssfile ='styles.css '; if (document.layers)cssfile ='n4styles.css '; document.writeln( '<link rel=stylesheet type="text/css "href="'+cssfile +'">'); //--> </script>

      Этот скрипт работает в предположении, что коллекция layers есть только в Netscape 4. О том, как поддерживать различные броузеры, см. "Сценарий работает в одном броузере, но не работает в другом").

    TopStyle, популярный редактор CSS, имеет список стилей, в котором указаны свойства стиля, работающие в том или ином броузере. TopStyle доступен на www.bradsoft.com.


    Содержание раздела