Руководство по CSS

CSS @правила (RULES)

Полный список свойств CSS

Функции CSS Полное руководство по селекторам CSS

Выборщик CSS3 :first-of-type

CSS псевдо-класс :first-of-type означает первый элемент своего типа среди братьев.

Полное руководство по CSS-селекторам

Онлайн пример

Выбранный элемент p является первым p в родительском элементе:

Пример

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">　
<title>Основной учебник (oldtoolbag.com)</title>　
<style>　
/* Выбор первого出现的 <p> в родительском элементе, независимо от его положения среди братьев */
p:first-of-type {
　　color: red;
}
</style>
</head>
<body>
<h1>Это заголовок</h1>
<p>Это первый абзац.</p>
<p>Это второй абзац.</p>
<p>Это третий абзац.</p>
<p>Это четвертый абзац.</p>
</body>
</html>

Проверьте, посмотрите ‹/›

Определение и использование

Выборщик :first-of-type соответствует элементам, которые являются первым ребенком своего родителя, независимо от их положения среди братьев.

Подсказка: И :nth-of-type(1) имеют одинаковый смысл.

Совместимость браузеров

Числа в таблице показывают первую версию браузера, поддерживающую этот свойство.

Выборщик
:first-of-type	4.0	9.0	3.5	3.2	9.6

Полное руководство по CSS-селекторам

Функции CSS Полное руководство по селекторам CSS