4. Псевдоэлементы

а) Тег:first-letter

Стиль для первой буквы текста внутри десктриптора с таким именем.
Пример.
При желании можно и не привязывать псевдоэлемент к определённому тегу.
Пример.




б) Тег:first-line

Стиль для первой строки.
Пример.
Можно и без привязки к определённому тегу.
Пример.




в) Тег:before и Тег:after

Позволяют добавить текст в начало и конец элемента соответственно. Добавляемый текст должен быть указан в атрибуте content.
(Internet Explorer поддерживает псевдоэлементы :before и :after начиная с версии 8.0.)
Пример.




г) Тег::selection

Применяет стиль к выделенному пользователем тексту. В правилах стилей допускается использовать следующие свойства: color, background и background-color. Псевдоэлемент работает в Opera11, Safari5 и GCh9, но не функционирует в MF3.6 и IE8.
Пример.

5. Псевдоклассы

(Примечание. Для корректного функционирования псевдоклассов анкеров те должны располагаться в таблице стилей в определённом порядке: link, visited, hover, active. Аббревиатура - LVHA, которую иногда расшифровывают как "Love, HA!")

а) a:link

Применяется только к ссылкам и определяет внешний вид тех из них, которые пользователем ещё не посещались.
(link - англ. связь, звено цепи)




б) a:visited

Применяется только к ссылкам и определяет внешний вид тех из них, которые уже посещались пользователем.
(visit - англ. заходить, посещать)




в) Тег:active

Определяет внешний вид элемента в момент щелчка. В тот короткий промещуток, когда кнопка мышки нажата, но ещё не отпущена. Обычно используется по отношению к ссылкам, но может применяться к другим элементам.
(active - англ. активный, энергичный)
Пример.




г) Тег:hover

Определяет внешний вид элемента, когда на него наведён указатель мышки. Обычно используется по отношению к ссылкам, но может применяться и к другим элементам.
(hover - англ. парить, нависать)
Пример.




д) Тег:focus

Определяет внешний вид элемента, когда на него наведён указатель мышки. Обычно используется по отношению к ссылкам, но может применяться и к другим элементам.
(hover - англ. парить, нависать)
Пример.



e) Тег:lang(язык)

Позволяет по-разному оформлять текстовые блоки, помеченные относящимися к разным языкам.
(lang → language - англ. язык)
Пример.



ё) Тег:first-child

Определяет внешний вид содержимого дескриптора, если тот является первым в родительском контейнере (первым из всех, а не только из подобных).
Пример.




ж) Тег:last-child

Определяет внешний вид содержимого дескриптора, если тот является первым в родительском контейнере (первым из всех, а не только из подобных). Не работает в IE8.
Пример.




з) Тег:only-child

Определяет внешний вид содержимого дескриптора, если тот является единственным в родительском контейнере (единственным из всех, а не только из подобных). Не работает в IE8.
Пример.




и) Тег:first-of-type

Определяет внешний вид первого из нескольких одинаковых дескрипторов в пределах другого (родительского) дескриптора. Не работает в IE8.
Пример.




й) Тег:last-of-type

Определяет внешний вид последнего из нескольких одинаковых дескрипторов в пределах другого (родительского) дескриптора. Не работает в IE8.
Пример.




к) Тег:only-of-type

Определяет внешний вид элемента, если он такой единственный у родителя. Не работает в IE8.
Пример.