Динамические эффекты с помощью :hover [13/18] Теория

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

В теоретической части указан следующий CSS-код

li.top ul.submenu {
display: none;
}

li.top:hover ul.submenu {
display: block;
}

Что означают выражения li.top и ul.submenu?

2

li.top - стили применяются только к элементам списка li, которые содержат класс .top
ul.submenu - стили только для списка с классом .submenu
Это как уточнение. Если писать просто селектор класса, то будет то же самое, за исключением момента, когда класс прописан для нескольких разных элементов.

3

Да, я уже разобрался, прочитав кучу стороннего материала. Проблема остается в том, что в теме про контекстные селекторы, было четко указано, что селектор может состоять из нескольких частей, разделенных пробелом. Я это воспринял как обязательное условие. И никак не мог понять, что li.top это контекстный селектор, означающий, что будет выбран элемент с классом top, находящийся в теге li. Аналогично и с ul.submenu.

2 лайка
4

А почему не срабатывает, если вместо strong использовать td:last-child?

tr:hover td:last-child{
    color: #0088cc; 
}
1 лайк
5

Как это не срабатывает? Срабатывает =)

6

Cрабатывает, но цель не засчитывается…)

2 лайка
7

А, вы про это. Хорошо, поправлю сегодня, спасибо.

2 лайка
8

Поправил.

1 лайк
9

прописал tr:hover td>em {display: inline;}
Страны стали появляться, но цель не засчитана! как по другому добиться нужного результата ?
По итогу понял напрямую обращаемся к em. Хотя мой способ тоже работает)

1 лайк
10

Дополнил проверку, теперь засчитывается и ваш вариант.

11

Этот вариант работает, но, почему-то, не засчитывается.

td:hover > em {
display: inline;
}

td:hover > strong {
color: #0088cc;
}

12

В задании сказано “… при наведении на строку таблицы…”

1 лайк
13

правильный ответ

tr:hover em {
    display:inline;
}
    
tr:hover strong {
    color: #0088cc;
}

В задании сказано про строки, поэтому и задавать атрибуты нужно строкам. Код выше проходит проверку полностью, задание зачитывается. А данная тема лично меня только запутала, к решению пришел после чашечки кофе :smile:

4 лайка
14

Согласен что теорию тут нужно всё таки поправить.

15

Здравствуйте! Прописал приблизительно так же как StroKeR, все работает но цель 1 не засчитывается. Практически второй вечер ломаю голову.

16

При наведении на строку…

17

Да, именно при наведении на строку… Все работает…Могу сделать скрин…

18

Первая цель - тоже “при наведении на строку…”

19

Да, и первая и вторая… Скрин:

Скрин экрана.gif1091×473 116 KB

20

Прочитайте первое написанное вами правило. На что вы там мышь наводите?