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

Курсы §8. Селекторы
1

Всем привет!)
Столкнулась с такой особенностью. Встретила несколько комментариев под этим заданием: чтобы правильно закрыть мишени, нужно сначала задавать стили для тега li (все закрасить белым), и только потом - закрасить красным вторую и пятую мишени с помощью соседних селекторов. Я попробовала наоборот - сначала красные мишени, потом белые:

.first+li,
.fourth+li {
background-color: red;
}

li {
background-color: white;
}

Результат:
2018-10-25_140910

Вопрос: почему не произошло переопределения стилей для li? Почему все элементы списка не стали белыми, в том числе и те, что прежде были закрашены красным? Или я неверно поняла само переопределение стилей?)

2

Дело в специфичности селекторов. Подробнее об этом будет в курсе “Наследование и каскадирование”.

1 лайк
3

Спасибо!
Но ошибки нет и в том, и в другом случае? (сначала белые или сначала красные) Я имею ввиду в плане “хорошего тона”.

4

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

1 лайк
5

Ещё раз сердечно благодарю! :hugs:

6

да, это говорилось даже в самом начале курсов ) вроде бы …

7

Добрый день!
Читаем задание:
“Биатлонист закрыл все мишени, кроме второй и пятой.”
Смотрим на мишени - красные вторая и пятая.

Смотрим index.html:

  <li class="first">1</li>
  <li>2</li>
  <li>3</li>
  <li class=***"fourth">4***</li>
  <li>*5*</li>**

Редактирование - недоступно.
Может стоит, наконец, привести в соответствие?

8

может вы css редактировать будете? глава называется “Основы CSS”, речь не про html.
как раз тема про соседние селекторы, поэтому вам надо выделить те <li>, которые стоят после <li>, имеющих классы.

1 лайк
9

В соответствие чему? Прочитайте теоретический материал к заданию про соседние селекторы. Вам нужно применять стили к следующему элементу после того, у которого задан класс, то есть first и fourth.

10

Разобрался. Спасибо. Вопрос снимаю.
Но подача теоретического материала в данной главе по качеству изложения и доступности для понимания все равно требует доработки.

1 лайк
11

Спасибо, мы учтём!