Обзор популярных расширений Joomla

Статьи о создании и развитии сайта

Обучающие материалы по верстке HTML\CSS


search

Верстка для разных браузеров

browsЗанимаясь над созданием сайта, можно увидеть, как некоторые элементы по-разному отображаются на различных браузерах, в особенности на Internet Explorer. Естественно эту проблему надо решать и выполнять верстку для разных браузеров.

При создании сайта компании очень важно, чтобы сайт одинаково хорошо смотрелся на всех браузерах, поэтому приходится использоваться различные приемы. Также с помощью таких приёмов можно задать для определенного браузера свой стиль, отличающихся от других.

Рассмотрим использование приёмов для наиболее распространенных браузеров...

Mozilla Firefox

Для браузеров код для CSS стилей будет следующий:

@-moz-document url-prefix() {
   #blok {
     color: #000;
   }
}

Goggle Chrome (также и в Safari)

Оба данных браузера используют движок webkit, для них будет следующая запись:

@media screen and (-webkit-min-device-pixel-ratio:0) {
     #blok {
        color: #000;
     }
     /* и другие правила стилей для webkit */
}

Opera

Для Opera записи для персональной верстки постоянно меняются, поэтому использование указанного приема будет на страх и риск:

@media (min-resolution: .001dpcm) {
    _:-o-prefocus, body { /* стиль только для Opera 12.00+ */
       background: red;
    };
}

Internet Explorer

Самый "капризный" из всех браузеров, часто он отличается не только от других браузеров, но и от своих ранних версий. Если писать для каждой версии IE отдельные правила, то потребуется отдельный файл стилей, путь к которому можно указать перед закрывающим </body>:

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

Здесь условия могут отличаться и быть:

  • IE — любая версия браузера Internet Explorer;
  • IE 7 — Internet Explorer 7; (8 и 9 соответственно)

Использование данных приёмов верстки для разных браузеров не является обязательным условием, лучшим же решением будет использование максимально валидного кода.

Добавить комментарий

Защитный код
Обновить

Joomla SEF URLs by Artio

Комментарии

  • Модуль VTEM Panorama

    Дмитрий
    Доброго времни суток! Несовсем догоняю как привязать к joomshoping те для каждого товара должен ...
     
  • Плагин Edocs

    sveta
    после перехода с http на https плагин перестал работать. Меняла все пути, которые возможно, но не ...
     
  • Компонент JoomShopping. Полезности

    Димы
    Ух, шикарно, спасибо. Изменил карточку товара. Цену и кнопку "В корзину" разместил слева от ...
     
  • Работа с категориями в K2

    Николай
    Подскажите пожалуйста, пользуюсь Serpstat. Комплексный аудит сайта по метатегам (путь:Аудит сайта ...
     
  • Компонент JoomShopping. Товары и категории

    Валерий
    Здравствуйте. Мне очень нужна Ваша помощь. Как возможно сделать, чтобы форма заказа товара в joomshopping ...