Селекторы, часть 1 / Контекстные и соседние селекторы [7/18]
×

Контекстные и соседние селекторы [7/18]

Селекторы в CSS можно очень гибко комбинировать. В частности, можно комбинировать контекстные и соседние селекторы.

Например, селектор .player-1 .hit + .miss сработает для тега с классом miss, если сразу перед ним расположен тег с классом hit и оба тега расположены внутри тега с классом player-1.

В этом задании вы потренируетесь комбинировать контекстные и соседние селекторы. Класс биатлониста будет задавать контекст, а соседние селекторы будут использоваться для выбора мишени.


Выполнить задание
HTML
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Контекстные и соседние селекторы</title> <link rel="stylesheet" href="/assets/course7/course-2.css"> </head> <body> <div class="shooter-1"> <ul class="target"> <li>1</li> <li>2</li> <li class="third">3</li> <li>4</li> <li>5</li> </ul> </div> <div class="shooter-2"> <ul class="target"> <li class="first">1</li> <li>2</li> <li class="third">3</li> <li>4</li> <li>5</li> </ul> </div> </body> </html>
CSS
HTML Academy

Начались «разборки» за второе место.

  1. Первый биатлонист закрыл все мишени, кроме четвёртой.
  2. А второй промахнулся по второй, а на четвёртой произошла ошибка техники.

    Образец попадания по мишеням
Теория Проверить Следующее задание
Идёт запись на курс Базовый HTML и CSS #16, который стартует 16 января.

Обсуждение и комментарии

Если у вас возникли сложности при прохождении задания, то вы можете обратиться за помощью на наш форум. Мы отслеживаем сообщения и постараемся ответить максимально быстро.

Пожалуйста, не пишите решение задач. Такие сообщения будут удаляться.

Перейти на форум или открыть комментарии.