|
first-child
Lorem ipsum dolor sit amet, consectetuer
adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet
dolore magna aliguam erat volutpat.
Ut wisis enim ad minim veniam, quis nostrud
exerci tution ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo
consequat.
Результат примера показан на рис. 1. В данном примере псевдокласс first-child
добавляется к селектору B и
устанавливает для него красный цвет текста. Хотя контейнер встречается в
первом абзаце три раза,
красным цветом будет выделено лишь первое упоминание, т.е. текст «Lorem ipsum».
В остальных случаях
содержимое контейнера отображается черным цветом. Со следующим абзацем все
начинается снова,
поскольку родительский элемент поменялся. Поэтому фраза «Ut wisis enim» также
будет выделена
красным цветом.
Internet Explorer Netscape Opera Safari Firefox
6.0 7.0 8.0 8.0 9.0 8.0 9.2 9.5 1.3 2.0 3.1 1.5 2.0 3.0
Нет Да Да Да Да Да Да Да Да Да Да Нет Да Да
CSS CSS1
Применяется Ко всем элементам
Аналог HTML Нет
Ссылка на спецификацию http://www.w3.org/TR/CSS21/selector.html#first-child
HTML 4.01 CSS 2.1 IE 6 IE 7 IE 8 Op 9.5 Sa 3.1 Ff 2.0 Ff 3.0
Рис. 1. Выделение цветом первого дочернего элемента абзаца
Пример 2
first-child
Историю эту уже начали забывать, хотя находились горожане, которые время от
времени
рассказывали ее вновь прибывшим в город посетителям.
Легенда обрастала подробностями и уже совсем не напоминала произошедшее в
действительности событие. И, тем не менее, ни один человек не решался
заикнуться
о ней с наступлением темноты.
Но однажды в город вновь вошел незнакомец. Он хромал на левую ногу.
Результат данного примера показан на рис. 2. По правилам типографики отступ
первой строки для первого
абзаца текста обычно не задают, но для остальных абзацев его добавляют. С этой
целью в примере
используется свойство text-indent со значением отступа 1em. Для изменения стиля
первого абзаца и
установки нулевого отступа, к селектору P добавлен псевдокласс first-child.
Рис. 2. Результат использования псевдокласса first-child
HTML 4.01 CSS 2.1 IE 6 IE 7 IE 8 Op 9.5 Sa 3.1 Ff 2.0 Ff 3.0
first-letter
Краткая информация
Описание
|
