Особую группу псевдоклассов образуют псевдоклассы, которые позволяют выбрать определенные дочерние элементы:
-
:first-child: представляет элемент, который является первым дочерним элементом
-
:last-child: представляет элемент, который является последним дочерним элементом
-
:only-child: представляет элемент, который является единственным дочерним элементом в каком-нибудь контейнере
-
:only-of-type: выбирает элемент, который является единственным элементом определенного типа (тега) в каком-нибудь контейнере
-
:nth-child(n): представляет дочерний элемент, который имеет определенный номер n, например, второй дочерний элемент
-
:nth-last-child(n): представляет дочерний элемент, который имеет определенный номер n, начиная с конца
-
:nth-of-type(n): выбирает дочерний элемент определенного типа, который имеет определенный номер
-
:nth-last-of-type(n): выбирает дочерний элемент определенного типа, который имеет определенный номер, начиная с конца
Псевдокласс first-child
Используем псевдокласс first-child для выбора первых ссылок в блоках:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Селекторы в CSS3</title> <style> a:first-child{ color: red; } </style> </head> <body> <h3>Планшеты</h3> <div> <a>Microsoft Surface Pro 4</a><br/> <a>Apple iPad Pro</a><br/> <a>ASUS ZenPad Z380KL</a> </div> <h3>Смартфоны</h3> <div> <p>Топ-смартфоны 2016</p> <a>Samsung Galaxy S7</a><br/> <a>Apple iPhone SE</a><br/> <a>Huawei P9</a> </div> </body> </html>
Читать далее![]()
Вступите в группу, и вы сможете просматривать изображения в полном размере
![]()
Это интересно
0
|
|||
Последние откомментированные темы: