- Теория
- Теория
Контекстные селекторы
Селектор может состоять из нескольких частей, разделённых пробелом, например:
p strong { ... }
ul .hit { ... }
.footer .menu a { ... }
Такие селекторы называют контекстными или вложенными. Их используют для того, чтобы применить стили к элементу, только если он вложен в нужный элемент.
Например, селектор .menu a
сработает для ссылки a
только в том случае, если она расположена внутри элемента с классом .menu
.
Читать их проще всего справа налево:
/* выбрать все теги strong внутри тегов p */
p strong { ... }
/* выбрать все элементы с классом .hit внутри тегов ul */
ul .hit { ... }
/* выбрать все ссылки внутри элементов с классом .menu,
которые лежат внутри элементов с классом .footer */
.footer .menu a { ... }
Таким образом, можно задавать элементам различные стили в зависимости от их контекста. Если ссылка расположена внутри меню, сделать её крупнее, а если внутри основного текста, то задать ей нужный цвет.
В этом задании вы потренируетесь использовать контекстные селекторы.
- index.html
Вы перешли на другую страницу
Кликните внутри мини-браузера, чтобы поставить фокус в это окно.