open
Добавить в закладки |
toggle shelf
![]() "Более 110 видеоуроков общей продолжительностью в 22 часа и 30 минут, которые позволят Вам создавать неповторимые динамические сайты с использованием языка PHP и баз данных MySQL." Скачать PHP+MySQL для начинающих. |
| Псевдоклассы #2 |
|
|
|
| Автор Administrator | |||||
| 04.04.2011 г. | |||||
Селекторы могут содержать более одного псевдокласса, которые перечисляются подряд через двоеточие, но только в том случае, если их действия не противоречат друг другу. Так, запись A:visited:hover является корректной, а запись A:link:visited — нет. Впрочем, если подходить формально, то валидатор CSS считает правильным любое сочетание псевдоклассов. ![]() Браузер Internet Explorer 6 позволяет использовать псевдоклассы :active и :hover только для ссылок. Начиная с версии 7.0 псевдоклассы в этом браузере работают и для других элементов. Псевдокласс :hover не обязательно должен применяться к ссылкам, его можно добавлять и к другим элементам документа. Так, в примере 1.55 показана таблица, строки которой меняют свой цвет при наведении на них курсора мыши. Это достигается за счет добавления псевдокласса :hover к селектору TR. ![]() Результат примера показан ниже (рис. 1.34). ![]() Псевдоклассы, имеющие отношение к дереву документаК этой группе относятся псевдоклассы, которые определяют положение элемента в дереве документа и применяют к нему стиль в зависимости от его статуса.:first-childПрименяется к первому дочернему элементу селектора. который расположен в дереве элементов документа. Чтобы стало понятно, о чем речь, разберем небольшой код (пример 1.56).![]() Результат примера показан ниже (рис. 1.35). ![]() В данном примере псевдокласс :first-child добавляется к селектору P и устанавливает для него рубленый шрифт и красный цвет текста. Хотя тег <P> внутри <div> встречается по два раза, стиль будет применяться только к первым абзацам. В остальных случаях стиль внутри <p> останется исходным. Со следующим тегом <div> все начинается снова, поскольку родительский элемент поменялся. Браузер Internet Explorer поддерживает псевдокласс :first-child начиная с версии 7.0.Псевдокласс :first-child удобнее всего использовать в тех случаях, когда требуется задать разный стиль для первого и остальных однотипных элементов. Например, по правилам типографики красную строку для первого абзаца текста не устанавливают, а для остальных абзацев добавляют отступ первой строки. С этой целью применяют свойство text-indent с нужным значением отступа. Но чтобы изменить стиль первого абзаца и убрать для него отступ потребуется воспользоваться псевдоклассом :first-child (пример 1.57). ![]() Результат примера показан ниже (рис. 1.36). ![]() В данном примере первый абзац текста не содержит отступа первой строки, а для остальных он установлен. Последние новости:
Старые новости:
|
|||||
| ← Псевдоклассы #1 | Универсальный селектор → |
Возможно, Вам необходимо зарегистрироваться на сайте или авторизоваться. |