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

В связи с релизом Интернет Эксплорера 7 хотелось бы упомянуть css псевдоэлементы, благо часть из них теперь поддерживается этим браузером тоже.

:first-line и :first-letter

Два этих псевдоэлемента дают хорошую возможность выделить начало абзаца или первую букву слова.

Пример применения:

p:first-letter {
    font-size: 3em;
    float: left;
}

p:first-line {
    font-weight: bold;
}

Поддерживающие браузеры: Интернет Эксплорер 7, Файрфокс, Опера 9

:before и :after

Эти псевдоэлементы открывают еще больший простор для форматирования, но в следствии того что они работают в связке со свойством content, не поддерживаются Интернет эксплорером.

:before и :after позволяют вставить контент перед и после любого HTML-элемента соответственно.

Допустимые значения свойства content в псевдоэлементах before и after:

-inhert
-[URI]
-[string]
-normal
-open-quote
-close-quote
-no-open-quote
-no-close-quote
-attr([attribute name])
-counter([name], [style])
-counters ([name], [string], [style])

Пример:

p:before { 
content: url(images/arrow.gif);
}

p:after {
content: close-quote; 
}

li:before {
content: ">>";
 }

Поддерживающие браузеры: Файрфокс, Опера.