Занимаясь над созданием сайта, можно увидеть, как некоторые элементы по-разному отображаются на различных браузерах, в особенности на Internet Explorer. Естественно эту проблему надо решать и выполнять верстку для разных браузеров.
При создании сайта компании очень важно, чтобы сайт одинаково хорошо смотрелся на всех браузерах, поэтому приходится использоваться различные приемы. Также с помощью таких приёмов можно задать для определенного браузера свой стиль, отличающихся от других.
Рассмотрим использование приёмов для наиболее распространенных браузеров...
Mozilla Firefox
Для браузеров код для CSS стилей будет следующий:
#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>:
Здесь условия могут отличаться и быть:
- IE — любая версия браузера Internet Explorer;
- IE 7 — Internet Explorer 7; (8 и 9 соответственно)
Использование данных приёмов верстки для разных браузеров не является обязательным условием, лучшим же решением будет использование максимально валидного кода.
