|Web Учебник | Самоучитель по HTML |Самоучитель по PHP + MySql |Основы PhotoShop |Контакты. |

Патчи в какскадных таблиц стилей для I.E., FireFox, Opera и Safari.

Как сказал на первой странице Самоучителя по каскадным таблицам стилей что CSS позволяет добиться межбраузерности, т.е. дизайн будет отображаться в всех браузерах не зависимо от операционной системы одинаково, но это немного не так, что бы добиться абсолютной межбраузерностью нужно пользоваться "хаками" или проще говоря патчами. Патч от английского patch - это заплатка, которая покрывает какую либо дыру. В каскадных таблицах стилей есть тоже "дыры", т.е. некоторые браузеры неправильно обрабатывают документы, в элементарных правилах дыры не образовываются, а вот с свойстами правил таких как: display, position, float и превдоклассы начинаются проблемы. Например InternetExplorer некорректно понимает float, а I.E-6 не понимает :hover вместо него можно использовать :focus, и таких примеров может быть сотни...

Патчи для браузера FireFox.

для браузера FireFox всех версий:
@-moz-document url-prefix() {
.style {color:#000000;}
}

Патчи для браузера Опера.

Только для Оперы-9.5:
html:first-child .style {
color:#000000;
}

Для других версий оперы:
@media all and (-webkit-min-device-pixel-ratio:10000),
not all and (-webkit-min-device-pixel-ratio:0) {
.style {color:#000000;}
}

или
*|html[xmlns*=""] .style {
color:#000000;;
}

CSS-патчи для браузера Safari.

Первый вариант:
body:last-child:not(:root:root) .style {
color:#000000;
}

Второй вариант:
html[xmlns*=""] body:last-child .style {
color:#000000;
}

CSS-патчи для браузера Internet Explorer.

Для браузера Internet Explorer 6 :
.style {
_color:#000000;
}

или
* html .style {
background: #F00;
}

Для браузера Internet Explorer 7 :
*+html .style {
color:#000000;
}

или
*:first-child+html .style {
color:#000000;
}

или
html>body .style {
color:#000000;
}

Патч для браузера Internet Explorer 8 :
@media \0screen {
.style {color:#000000;}

Патч для браузера Internet Explorer 9 :
:root .style {
color:#000000;\9;
}

Из-за постоянных проблем в Internet Explorer, были разработаны даже условные конструкции в которые помещают стили тегом link или style:
<!--[if IE]>
<style type="text/css">
html{overflow:auto;} body{color:#000000;}
</style>
<![endif]-->
<!--[if IE]> ... <![endif]--> - для всех версий Internet Explorer
<!--[if IE 5]> ... <![endif]--> - только для 5 версии.
<!--[if IE 6]> ... <![endif]--> - только для 6 версии.
<!--[if IE 7]> ... <![endif]--> - только для 7 версии.
<!--[if IE 8]> ... <![endif]--> - только для 8 версии.
<!--[if IE 9]> ... <![endif]--> - только для 9 версии.
<!--[if ! IE]> ... <![endif]--> - не для Internet Explorer.
<!--[if lt IE 7]> ... <![endif]--> - для всех что ниже 7.
<!--[if gt IE 6]> ... <![endif]--> - для всех что выше 6.
<!--[if gte IE 7]> ... <![endif]--> - для 7 и выше.
<!--[if lte IE 7]> ... <![endif]--> - для 7 и ниже.
<!--[if ! gte IE 7]> ... <![endif]--> - для всех версий кроме 7.
В последних 5 вариантах цифра может быть любая до 9.

 

                   Перейти к выбору следующей страницы
 

Добавить в закладки
Добиться абсолютной межбраузерности для механизма добавления в закладки не существует ни на каких языках!!! А для браузера "Chrome" не работают вообще ни какие механизмы!!!
Потому это лучше всего делать в ручную при помощи одновременого нажатия клавиш Ctrl и D , после чего нужно нажать готово(добавить). Такой "механизм работает всегда и везде!!!