Поддержка сайта

Высокие позиции в поисковой системе, на прямую зависят от развития вашего сайта.

Продвижение сайтов

Эффективность стратегий продвижения подтверждается сотрудничеством с крупными клиентами и отзывами о нашей работе.

Создание сайтов

Мы делаем сайты быстро, недорого и профессионально. От работы с нами, у вас останутся только положительные эмоции.

Структурные псевдоклассы

.

Структурные псевдоклассы

До сих пор мы видели, как мы можем выбирать элементы по их атрибутам и состоянию. CSS3 дают возможность обращаться к элементам просто исходя из их положения в разметке. Такие селекторы называются структурными псевдоклассами.

На первый взгляд это может показаться чрезвычайно сложным, но позднее вы поймете, насколько они удобны. Эти селекторы поддерживаются в IE9, а также в актуальных и более старых версиях других браузеров — но только не в Internet Explorer версии 8 и более ранних.

:root

Корневой элемент; это всегда элемент html.

EF: nth-child (n)

Элемент F, n-й по счету потомок Е.

EF:nth-last-child(n)

Элемент F, дочерний элемент Е, п-й по счету от конца списка, li:nth-last-child(1) будет последним элементом любого списка; эта запись означает то же самое, что и li : last-child.

E:nth-of-type(n)

Это п-й по счету элемент данного типа среди потомков данного родителя.

E:nth-last-of-type(n)

То же что и в предыдущем случае, но счет ведется от последнего элемента.

E:first-child

Элемент Е, первый потомок данного родительского элемента. То же самое, что и : nth-child (1).

Е: last-child

Элемент Е, последний потомок данного родительского элемента. То же самое, что и : nth-last-child (1).

E:first-of-type

То же самое, что и : nth-of-type (1).

E:last-of-type

Тоже самое, что и :nth-last-of-type (1).

Е: only-child

Элемент, представляющий собой единственного потомка данного родительского элемента.

E:only-of-type

Единственный элемент данного типа среди потомков одного родительского элемента.

Е: empty

Элемент, не имеющий дочерних элементов, включая текст; таким образом, <р>привет</р> не будет считаться совпадением.

E:lang(en)

Этот псевдокласс позволяет явно указать стили, которые необходимо применять к тому или иному языку (двухбуквенное значение в скобках).

Е: not (exception)

Это особенно полезный псевдокласс; он позволяет выбрать элементы, не соответствующие селектору в круглых скобках.

Селекторы с псевдоклассом : not сначала выбирают соответствия условию, расположенному левее двоеточия, а затем исключают из этой группы элементы, соответствующие условию справа от двоеточия. Проверка условия слева выполняется первой. Например, p:not(. copyright) выберет все абзацы в документе, а затем исключит из выбранного те, которые имеют класс copyright.

Вы можете в одной строке использовать несколько селекторов с псевдоклассом : not. h2 : not (header > h2): not (. logo) будет означать все заголовки h2 на странице, за исключением потомков элемента header и тех, которые принадлежат к классу logo.


.

Читайте так же:
Not found