CSS:target

Существует довольно занятный и малоизвестный селектор псевдо-класса — :target. Селектор указывает на элемент, id которого совпадает с хэшом текущего uri. Редко используется, и придает пикантности одностраничным сайтам

Примеры: http://superk.ru(переход по пунктам меню меняет цвет заголовка на оранжевый).

HTML

[html]

Категория 1

Категория 2

[/html]

тут нужно обратить внимание на id элементов

CSS-стиль

[css]
/* относится ко всем target-элементам */
:target {
color: #000;
}

/* относится к элементам H2 */
h2:target {
color: #f00;
}
[/css]

При желании, с помощью html5 возможно создать анимацию при переходе к target-элементу. Но html5-анимация — это уже отдельная тема

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