[9/20] голубенькие карты

Курсы §18. Селекторы. Часть 2
1

Здравствуйте! Задачу то я решил, но не совсем правильно.

Сделал так:
.cards .diamond:not(.nine):not(.king):not(.seven):not(.jack) {
background-color: #0099ff;
}

Посмотрел на форуме, что лучше делать общей формулой, а не перечислять:

.diamond:nth-child(2n){
background-color: #0099ff;
}

Понять не могу, почему он работает( Сверху-вниз он что ли элементы перебирает? Если кто понимает, поясните, пожалуйста:blush:

2

Смотрите вы задаете фон для:

  1. Для всех дочерних тегов элементов ul, без учета типа элемента, соответственно считать начинаем с пустого div. Это можно проверить задав фон для li:nth-child(2n) - выделение начнется с шестерок, у них “порядковый номер” 2.
  2. Из всех дочерних элементов вы выбираете те у которых класс .diamond.
1 лайк
3

Спасибо большое, теперь понял как.:blush: