Справочник по CSS : Тематический указатель : Селекторы : Псевдоклассы : :target
смотрим также
Материал из Справочник Web-языков
Содержание |
Псевдокласс :target
Используется для добавления стиля к целевому элементу (якорной ссылке) на странице.
Синтаксис
element:target { style properties }
Замечания
Часто на странице с большим количеством текста используются якорные ссылки (anchor), чтобы нажав на заголовок вверху страницы, пользователь автоматически перешел к нужному фрагменту текста, не прокручивая документ самостоятельно. Якорем может быть любой элемент, для которого указан id.
С помощью псевдокласса :target целевым элементам можно назначить различные стили.
Примеры
В примерах показано как описать псевдокласс :target.
:target { outline: dotted red } /* рисуем красную пунктирную линию вокруг элемента */
/* красно-желтые стрелки указывают на целевой элемент */ :target { -moz-box-shadow: 0.2em 0.2em 0.3em #888; -webkit-box-shadow: 0.2em 0.2em 0.3em #888; } :target:before { font: 70% Arial,"Nimbus Sans L",sans-serif !important; content: "\25ba"; /* ► */ color: red; background: gold; border: solid thin; padding-left: 1px; display: inline-block; margin-right: 0.13em; vertical-align: 20%; }
/* целевые заголовки формата h1 будут подсвечены красным */ h2:target { background: #ff0000; }
Стандарты
Этот псевдокласс определен в CSS 3 Selectors
Поддерживаемые браузеры
Firefox (Gecko) начиная с версии 1.0 (1.3)
Opera начиная с версии 9.5
Safari (WebKit) начиная с версии 3.1 (525)