В помощь верстальщику: Статьи - Как подружить CSS и IE6

Заказ продвижения сайта раскрутка
поиск  
  На главную Услуги и цены О компании Портфолио Гостевая книга Контакты
Сегодня:
                 Карта сайта:   Карта сайта Сделать стартовой Написать письмо Добавить в избранное  
     1. Создание сайта
     2. Верстка сайта
     3. Web - дизайн
     4. Редизайн
     5. Веб - дизайн
     6. Разработка банеров
     7. Поддержка сайта
     8. Продвижение сайта
     9. Раскрутка сайта
            <Подробнее>
     1. В помощь верстальщику
     2. В помощь дизайнеру
     3. В помощь оптимизатору
В помощь верстальщику:Статьи:Как подружить CSS и IE6

      Как подружить CSS и IE6 Количество багов, которые «всплывают» при реализации CSS в InternetExplorer 6 версии, не может не поражать. А верстальщикам, которым для верстки сайта порой приходится невероятно ухищряться, они до боли знакомы. Для нейтрализации этих багов были разработаны специальные правила – «хаки». Их приходится применять, когда никак иначе уже не справиться с этой «непрямой» программой. Что весьма неприятно засоряет код, ненужный другим браузерам, но автоматически подгружаемый ими. Ведь для верстки сайта под Firefox и Opera таких проблем не возникает, а значит, и «хаки» им не нужны.

     Как спрятать «хак» и уберечь «хорошие» браузеры от лишнего кода? Первый шаг – верстка сайта вообще без «хаков», только после этого выявляются места, где без них совсем никак, и только в этих местах «хаки» ставятся.

     Второй шаг – использование conditional comments. IE, начиная с 5 версии, поддерживает это решение. С помощью такого комментария:

      <link href="style.css" rel="stylesheet" type="text/css" media="all" />

      <!--[if IE]><link rel="stylesheet" type="text/css" href="ie.css" media="all"/><![endif]-->

     вы убережете все браузеры, кроме IE, от прочтения лишнего кода. Во второй строке прямо написано, что читать ее стоит только, «если IE».

     Возьмем довольно распространенный «хак»:

     #element {

     position:relative; /* Основное правило для всеx браузеров */

     }

      * HTML #element {

      position:static; /* Переопределение правила для IE младше седьмой версии */

     }

     и «спрячем» его в отдельный файл style.css:

     style.css:

     #element {

      position:relative; /* Основное правило для всеx браузеров */

     }

     ie.css:

     #element {

      position:static; /* Переопределение правила для IE всех версий */

      }

     Результат – максимально положительный из возможных (в идеале бы вообще «хаков» не было). Валидная верстка сайта, упрощенный код, сокращение объема загружаемого кода для не-IE браузеров.

Rambler's Top100 Рейтинг@Mail.ru

Наши партнеры
©2006 Дизайн-студия «Skyline Lab» - Заказ продвижения раскрутка сайта Web-дизайн, ре-дизайн сайта
Hosted by uCoz