# Контекстный селектор в CSS

Контекстный селектор, представляющий собой команду пробел `` , позволяет выбирать теги, вложенные в заданного родителя

## Синтаксис

`селектор1 селектор2 { }`

## Пример

Давайте обратимся ко всем тегам `p` внутри тегов `div` и покрасим их в красный цвет:

`<div> <p> text </p> <p> text </p> </div>` `div p { color: red; }`

:

## Пример

Давайте обратимся ко всем тегам `p` внутри элемента с `#elem` и покрасим их в красный цвет:

`<div id="elem"> <p> text </p> <p> text </p> </div>` `#elem p { color: red; }`

:

## Пример

Давайте обратимся ко всем тегам `p` внутри элементов с классом `.block` и покрасим их в красный цвет:

`<div class="block"> <p> text </p> <p> text </p> </div>` `.block p { color: red; }`

:

## Пример

Давайте обратимся ко всем тегам `b` внутри тегов `p`, находящихся внутри тегов `div` и покрасим их в красный цвет:

`<div> <p> text <b>+</b> </p> </div>` `div p b { color: red; }`

:

## Смотрите также

- Дочерний селектор,
  который позволяет выбрать элементы по непосредственной вложенности
- Соседний селектор,
  который позволяет выбрать элемент по его соседу
- Родственный селектор,
  который позволяет выбрать элементы после заданного
- Универсальный селектор,
  который позволяет выбрать все элементы

↑