Связь и интернет Архив Программирование
   
Сделать стартовойСделать закладку            
   ПОИСК  
   
Главная / CSS / Каскадные таблицы стилей, уровень 1. /
8  Perl
8  PHP
8  JavaScript
8  HTML
8  DHTML
8  XML
8  CSS
8  C / C++
8  Pascal и Delphi
8  Турбо Ассемблер
8  MySQL
8  CASE-технологии
8  Алгоритмы
8  Python
8  Обратная связь
8  Гостевая книга
Новости о мире


Псевдо-классы и псевдо-элементы - Программирование от RIN.RU
Псевдо-классы и псевдо-элементы



Псевдо-элементы в селекторах           Назад


В контекстных селекторах псевдо-элементы допускаются только в конце селектора:


BODY P:first-letter { color: purple }


Псевдо-элементы могут в селекторах комбинироваться с классами:


P.initial:first-letter { color: red }


<P CLASS=initial>First paragraph</A>


Этот пример позволит сделать темно красными первые буквы всех параграфов, имеющих класс initial. При комбинировании с классами или псевдо-классами псевдо-элементы должны указываться в конце селектора. В одном селекторе может быть указан только один псевдо-элемент.


Множество псевдо-элементов           Назад


Можно комбинировать несколько псевдо-элементов:


P { color: red; font-size: 12pt }
P:first-letter { color: green; font-size: 200% }
P:first-line { color: blue }


<P>Some text that ends up on two lines</P>


В этом примере первая буква каждого элемента "P" будет зеленой с размером шрифта 24pt. Остаток первой строки (в соответствии с форматированием на холсте) будет синим, в то время как весь остальной параграф будет красным. Предположив, что перенос строки произойдет перед словом "ends", фиктивная последовательность тэгов будет такова:


<P>
<P:first-line>
<P:first-letter>
S
</P:first-letter>ome text that
</P:first-line>
ends up on two lines
</P>


Обратите внимание, что элемент "first-letter" находится внутри элемента "first-line". Свойства, установленные в "first-line" будут унаследованы "first-letter", но будут переопределены, если то же свойство установлено в "first-letter".


Если псевдо-элемент разрывает настоящий элемент должны быть сгенерированны дополнительные тэги в фиктивной последовательности тэгов. Например, если элемент SPAN длится дальше тэга , должен быть сгенерирован дополнительный набор тэгов SPAN, т.е. фиктивная последовательность тэгов примет следующий вид:


<P>
<P:first-line>
<SPAN>
This text is inside a long
</SPAN>
</P:first-line>
<SPAN>
span элемент
</SPAN>

<<<  Назад
 1  2  3 


 8  Комментарии к статье  8 8  Обсудить в чате

8  В тему

Терминология

Базовые понятия

Каскадирование

Модель форматирования

Свойства CSS1

Единицы измерения значений

Совместимость с CSS1

 
  
  
    Copyright ©  RIN 2003 - 2004      * Обратная связь