CSS After

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

CSS after

Новые свойства CSS псевдоэлементов

Начнем наше детальное знакомство со свойствами CSS 3-й версии. В алфавитном порядке первым идет так называемый псевдоэлемент after.

Какова основная задача селектора after в CSS ? → Он отображает обозначенный внутри своего же параметра content текст после объекта, в оформлении которого участвует. Давайте посмотрим конструкцию псевдоэлемента after и его параметры на конкретном примере ниже.

<title>after в css</title>
<style type="text/css">
p.naprimer:after {content:" - пример с селектором after"; color:#c00}
</style>
</head>
<body>
<p class="naprimer">В интернете много всего интересного!</p>

Смотрим результат:

В интернете много всего интересного!

Обратите внимание на код выше. Параграф имеет класс naprimer, который мы описали в CSS.

Продолжаем изучение новых свойств в CSS 3, на очереди псевдоэлемент before, который работает по аналогии с представленным здесь after, но наоборот.
Напомню, что в меню слева доступны подробные уроки по Каскадным таблицам стилей.

Дата публикации: Январь 2013 | Обновление: Август 2014

Псевдоэлементы: CSS after   Современный CSS справочник

    Сохранить в сервисы и закладки