Головна / Селектори

Основні

(“*”)

Вибирає всі елементи.

(“.class”)

Вибирає всі елементи з заданим класом.

(“#id”)

Вибирає один елемент із заданим атрибутом id.

(“element”)

Вибирає всі елементи з заданою назвою тегу.

(“selector1, selector2, selectorN”)

Вибирає об`єднані результати всіх вказаних селекторів.

Ієрархія

(“parent > child”)

Вибирає всі прямі дочірні елементи, визначені «дочірнім» з елементів, визначених «батьком».

(“ancestor descendant”)

Вибирає всі елементи, які є нащадками даного предка.

(“prev + next”)

Вибирає всі наступні елементи, що відповідають "наступному", перед якими безпосередньо передує "попередній".

(“prev ~ siblings”)

Вибирає всі споріднені елементи, які слідують після елемента "попереднього", мають однаковий батьківський елемент і відповідають фільтрувальному селектору "побратимів".

Основні фільтри

:animated

Вибирає усі елементи, які перебувають у процесі анімації під час запуску селектора.

:header

Вибирає всі елементи, які є заголовками, наприклад h1, h2, h3 тощо.

:lang()

Вибирає всі елементи вказаної мови.

:not()

Вибирає всі елементи, які не відповідають заданому селектору.

:root

Вибирає елемент, який є коренем документа.

:target

Вибирає цільовий елемент, зазначений ідентифікатором фрагмента URI документа.

Фільтри вмісту

:contains()

Вибирає усі елементи, які містять вказаний текст.

:empty

Вибирає усі елементи, які не мають дочірніх елементів (включаючи текстові вузли).

:has()

Вибирає елементи, які містять принаймні один елемент, що відповідає вказаному селектору.

:parent

Вибирає усі елементи, які мають принаймні один дочірній вузол (елемент або текст).

Фільтри видимості

:hidden

Вибирає всі елементи, які приховані.

:visible

Вибирає всі видимі елементи.

Атрибути

[name|="value"]

Вибирає елементи, які мають вказаний атрибут зі значенням, рівним заданому рядку, або починається з цього рядка з дефісом (-).

[name*="value"]

Вибирає елементи, які мають вказаний атрибут зі значенням, що містить заданий підрядок.

[name~="value"]

Вибирає елементи, які мають вказаний атрибут зі значенням, що містить задане слово, розділене пробілами.

[name$="value"]

Вибирає елементи, які мають вказаний атрибут зі значенням, що закінчується точно на заданий рядок. Порівняння чутливе до регістру.

[name="value"]

Вибирає елементи, які мають вказаний атрибут зі значенням, точно рівним певному значенню.

[name!="value"]

Вибирає елементи, які або не мають зазначеного атрибута, або мають вказаний атрибут, але не мають певного значення.

[name^="value"]

Вибирає елементи, які мають вказаний атрибут зі значенням, що починається точно з заданого рядка.

[name]

Вибирає елементи, які мають вказаний атрибут з будь-яким значенням.

[name="value"][name2="value2"]

Відповідає елементам, які відповідають усім вказаним фільтрам атрибутів.

Дочірні фільтри

:first-child

Вибирає всі елементи, які є першими дочірніми для їх батьків.

:first-of-type

Вибирає всі елементи, які є першими серед братів і сестер з однаковою назвою елемента.

:last-child

Вибирає всі елементи, які є останніми дочірніми їх батьками.

:last-of-type

Вибирає всі елементи, які є останніми серед братів і сестер того самого імені елемента.

:nth-child()

Вибирає всі елементи (по індексу), які є дочірніми свого батька.

:nth-last-child()

Вибирає всі елементи (по індексу), які є дочірніми свого батька, рахуючи від останнього елемента до першого.

:nth-of-type()

Вибирає всі елементи (по індексу), які є дочірніми свого батька щодо братів і сестер з однаковою назвою елемента.

:nth-last-of-type()

Вибирає всі елементи (по індексу), які є дочірніми свого батька щодо братів і сестер з однаковою назвою елемента, рахуючи від останнього елемента до першого.

:only-child

Вибирає всі елементи, які є єдиними дочірніми для свого батька.

:only-of-type()

Вибирає всі елементи, які не мають братів і сестер з однаковою назвою елемента.

Форми

:button

Вибирає всі елементи типу button.

:checkbox

Вибирає всі елементи типу checkbox.

:checked

Відповідає всім елементам, які позначені або виділені.

:disabled

Вибирає всі елементи, які вимкнено.

:enabled

Вибирає всі елементи, які ввімкнено.

:focus

Вибирає елемент, якщо він зараз у фокусі.

:file

Вибирає всі елементи типу файл.

:image

Виділяє всі елементи типу зображення.

:input

Вибирає всі елементи введення, текстової області, виділення та кнопки.

:password

Вибирає всі елементи типу password.

:radio

Вибирає всі елементи типу radio.

:reset

Вибирає всі елементи типу reset.

:selected

Вибирає всі виділені елементи.

:submit

Вибирає всі елементи типу submit.

:text

Виділяє всі елементи введення типу text.