CSS - Селекторы

Page / - Изменено Alexandr Fokin в 2023/02/15 16:57

Селекторы

Изменено Alexandr Fokin

в 2023/02/15 16:57

Оглавление

<style>
<--Для указанного селектора-->
[селектор]
{
[свойство1]: значение1
[свойство2]: значение2
}
<--Для списка указанных селекторов-->
[селектор1], [селектор2]
{
[свойство1]: значение1
[свойство2]: значение2
}
<--Для таких селекторов [селектор2], являющихся вложенным по отношению к [селектор1] (любого уровня )-->
[селектор1] [селектор2]
{
[свойство1]: значение1
[свойство2]: значение2
}
<--Для таких селекторов [селектор2], являющихся вложенным по отношению к [селектор1] (только 1 уровень вложения)-->
[селектор1] > [селектор2]
{
[свойство1]: значение1
[свойство2]: значение2
}
<--Для таких селекторов [селектор2], первый элемент свурху на том же уровне [селектор1]-->
[селектор1] + [селектор2]
{
[свойство1]: значение1
[свойство2]: значение2
}
<--Для таких селекторов [селектор2], перед которыми на том же уровне имеется [селектор1]-->
[селектор1] ~ [селектор2]
{
[свойство1]: значение1
[свойство2]: значение2
}
</style>

Допустимые селекторы

Имя/Формат	Описание	Сила приоритета применения
*	Все элементы	1
Имя тега	2
Имя тега[Имя атрибута]	Все теги, у явно указан данный атрибут	2
Имя тега[Имя атрибута="Значение атрибута"]	Все теги, у явно указан данный атрибут с опеределенным значением. ^ - Значение начинается с подстроки | Имя тега[Имя атрибута^="Значение атрибута"] $ - Значение оканчивается подстрокой | Имя тега[Имя атрибута$="Значение атрибута"]	2
Имя класса	Атрибуит class	3
Id	Атрибут id	4
!important

Селектор регистрочуствителен
Селекторы обладают приоритетами (от * до id)