Контексттық селектор CSS-те
Контексттық селектор, бұл
пробел командасы (' '),
берілген аталыққа енгізілген тегтерді таңдауға мүмкіндік береді
Синтаксис
селектор1 селектор2 {
}
Мысал
Барлық p тегтеріне
div тегінің ішінде қарап, оларды қызыл түске бояйық:
<div>
<p>
text
</p>
<p>
text
</p>
</div>
div p {
color: red;
}
:
Мысал
#elem элементінің ішіндегі барлық p тегтеріне қарап,
оларды қызыл түске бояйық:
<div id="elem">
<p>
text
</p>
<p>
text
</p>
</div>
#elem p {
color: red;
}
:
Мысал
.block класы бар элементтердің ішіндегі барлық p тегтеріне қарап,
оларды қызыл түске бояйық:
<div class="block">
<p>
text
</p>
<p>
text
</p>
</div>
.block p {
color: red;
}
:
Мысал
div тегтерінің ішінде орналасқан
p тегтерінің ішіндегі барлық b тегтеріне қарап,
оларды қызыл түске бояйық:
<div>
<p>
text <b>+</b>
</p>
</div>
div p b {
color: red;
}
:
Сондай-ақ қараңыз
-
Балалық селектор,
элементтерді тікелей ішке ену бойынша таңдауға мүмкіндік береді -
Көршілес селектор,
элементті оның көршісі бойынша таңдауға мүмкіндік береді -
Аға-іні селекторы,
берілгеннен кейінгі элементтерді таңдауға мүмкіндік береді -
Универсалды селектор,
барлық элементтерді таңдауға мүмкіндік береді