Обратил внимание, что для выбора пересечения 2х селекторов нужно писать их в определенном порядке. т.е.: такой селектор сработает: (подразумевается что все теги в html присутствуют)
.cards:first-of-type li:first-child {
background: #0099ff;
}
А такой не сработает, хотя формально мы просто поменяли местами селекторы (пробел перед точкой, как оказалось, не играет роли)
li:first-child .cards:first-of-type {
background: #0099ff;
}Не запутывайте других, пожалуйста. Порядок селекторов имеет значение, поскольку браузер читает их справа налево.
Повторите тему “Селекторы, Часть 1”, чтобы не делать ошибочные выводы.
Можно было подумать и иначе, теоретически, в математике например перемена мест слагаемых роли не играет, но тут не так.
П.с. В посте я спрашивал, а не утверждал.
В посте не было знака вопроса)
Ну, как бэ порядок селекторов - это не сумма, чтобы вспоминать правило про перемену мест слагаемых ))
Здесь речь о том, какую линию я выберу первую, горизонтальную, или вертикальную, что бы в итоге получился крест как будто.
А можно в этом примере (задание 3) выбрать сперва вертикальные элементы, а потом горизонтальные? У меня получилось только наоборот(
Напишите свой код, посмотрим.
Я хотел вот так:
.cards li:first-of-type ul:first-of-type li {
background-color: #0099ff;
}
Т.е. первый селектор выбирает столбец, вертикаль (потенциально), 2ой ряд, горизонталь.
Добрый вечер. Вариантов решения похоже несколько. Я решаю эти задачи по другому, не так как в ответах. Интересно, есть ли критерий: правильно-непрвильно. Или если рботает, то правильно?
li:first-of-type {
background-color: #ff3300;
}
.cards:first-of-type>li {
background-color: #339933;
}
li.ace.heart:not(:nth-child(5)) {
background-color: #0099ff;
}