Несколько примеров работы с CSS: устранение обводки полей в некоторых браузерах и выделение правил для Internet Explorer

Несколько примеров работы с CSS: устранение обводки полей в некоторых браузерах и выделение правил для Internet Explorer | n-wp.ru

Не мне вам объяснять, что разные браузеры работают по-разному. Одним из ярких примеров является поведение текстовой формы при вводе логина или комментария – в Google Chrome и Safari она обводится. Если дизайн вашего блога сильно контрастирует с этим, то можно убрать принудительную обводку, применив простое правило.

Несколько примеров работы с CSS: устранение обводки полей в некоторых браузерах и выделение правил для Internet Explorer

Как устранить обводку активных полей в браузерах на движке WebKit

Для этого добавьте в style.css такое правило:

input[type="text"]:focus {
outline: none;
}

Теперь когда какой-нибудь элемент, в котором нужно вводить текст, получит фокус, то Safari не будет обводить его голубой, а Google Crome желтой рамкой.

Как добавлять правила для предыдущих версий Internet Explorer

Описанное выше правило будет работать только в тех браузерах, которые перехватывают фокус, в Internet Explorer 6 они не работают. Однако есть много загвоздок, связанных со старыми версиями IE, и если под нее писать отдельное оформление, то можно легко запутаться. Гораздо проще вставлять в работающий код правила, которые будут работать только в Internet Explorer, тем более, что выделить их визуально очень легко. Есть определенные символы, вставляя которые перед условием, мы делаем его понятным только определенной версии IE. Пример:

div {
color: #aaa; /* это правило работает во всех браузерах */
*color: #bbb; /* это правило работает только в Internet Explorer 7 и ниже */
_color: #codec; /* это правило работает только в Internet Explorer 6 и ниже */
}

Это гораздо проще, чем писать отдельные блоки для каждой версии Internet Explorer.

Автор tiaurus 2182 Articles
Являюсь создателем n-wp.ru — блога о WordPress для новичков. Мне интересно многое, поэтому еще я сделал 123-box.ru — блог о программах для Windows, и tiaurus.info — блог о красоте.

Оставьте первый комментарий

Оставить комментарий

Ваш электронный адрес не будет опубликован.


*