:before | Псевдоэлемент CSS - Справочник CSS3 | Делай сайт
Приветствую Вас, Гость! Регистрация
Георгиевская ленточка
Понедельник, 05.12.2016
Главная » Справочник CSS3 » Псевдоэлементы


2D & 3D ТрансформацияСвойства контента
Свойства импортаСвойства углов
Свойства границСвойства анимации
ПсевдоклассыПсевдоэлементы
Свойства размераСвойства контура
Свойства переходаСвойства печати
Свойства тениСвойства отступов
Свойства текстаСвойства колонок
Свойства полейПозиционирование
Свойства интерфейсаТипы значений
Полезные статьиСвойства списка
Свойства шрифтаСвойства таблицы
Свойства фонаВендорные префиксы



Адаптивный сайт - aTmpl


:before | Псевдоэлемент CSS

Псевдоэлемент :before генерирует контент в начало элемента.




Псевдоэлемент :before генерирует заранее установленный в свойстве  content и добавляет его в начало элемента.При этом генерируемым может быть любой элемент ( кроме форм ),например картинка.Свойство применимо ко всем элементам ( кроме элементов форм ),создано в версии CSS2 но проходит валидацию согласно версии CSS3.




Дополнительные свойства :before


Свойство
Описание
contentГенерирует установленный контент


Дополнительные псевдоэлементы :before


:afterГенерирует значения content в конец существующего контента


Свойство работает в браузерах




Пример применения свойства



<!DOCTYPE html>
<html lang="ru">
<head>
<title>Свойство псевдоэлемента :before</title>
<meta charset="utf-8">
<style type="text/css">
<!--
.rem {
color:green;
font-size:24px;
}
.rem:before {
content:url('http://delaisait.ucoz.ru/css/demo/img/remont.png');
}
h1 {
color:indigo;
}
h2{
color:red;
text-decoration:blink;
}
-->
</style>
</head>
<body>
<h1>Вебмастеру uCoz</h1>
<h2>Помощь в установке и настройке элементов сайта uCoz</h2>
<a href="http://delaisait.ucoz.ru/"><div class="rem"> Воспользоваться</div></a>
</body>
</html>

Пример в действии




Поэкспериментируйте сами





Русские шрифты






Источник: http://www.w3.org/TR/CSS21/selector.html#before-and-after
Категория: Псевдоэлементы | Добавил: IZOTOP (07.04.2012) | Автор: Меренков Михаил E W
Просмотров: 743 | Теги: css, :before, элемент, свойство, style, генерировать, псевдоэлемент | Рейтинг: 0.0/0

Вопросов / Советов / Предложений - относящихся к материалу: 0

Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]