Псевдоклассы :not и *

Псевдоклассы :not и *

Особый псевдокласс: not позволяет привязать стиль к любому элементу Web- страницы, не удовлетворяющему заданным условиям. Таким условием может быть любой селектор:

<основной селектор>:not(<селектор выбора>) { <стиль> }

Стиль будет привязан к элементу Web-страницы, удовлетворяющему основному селектору и не удовлетворяющему селектору выбора.

Пример:

DIV: not(#cmain) { background-color: yellow }

Здесь мы указали в качестве основного селектора стиль переопределения тега <DIV>, а в качестве селектора выбора — именованный стиль cmain. В результате данный стиль будет применен ко всем блочным контейнерам, за исключением cmain.

А вот стиль, который будет применен ко всем строкам таблицы, за исключением первой:

TR: not(:nth-child(1)) { background-color: grey }

Псевдокласс * ("звездочка") обозначает любой элемент Web-страницы. Пример:

#cmain > *:first-child { border-bottom: medium solid black }

Этот стиль будет применен к первому элементу любого типа, который непосредственно вложен в контейнер cmain.

Данный текст является ознакомительным фрагментом.