Цвет шрифта CSS при создании выпадающего меню + всплывающее меню

Question

Я пытаюсь сделать красивое меню CSS для этого сайта . (Домен - это просто песочница, а не сайт, на котором я собираюсь использовать разработанные страницы!)

Как вы можете видеть, вверху есть меню CSS. Когда вы наводите курсор мыши на один из разделов, он все хорошо опускается, но текст подменю остается черным, а не #CCC (серый), который я хотел - мне нужен черный для цвета шрифта при наведении, по эстетическим соображениям , Я проверил текущие стили CSS в части инспектора Google Chrome (F12), и часть раздела #CCC была вычеркнута. Из того, что я понимаю, это означает, что это было завышено, но я не знаю, что ...

Если у кого-то есть подобная функция кода в их браузере, я был бы очень признателен, если бы вы могли проверить это. Я создал меню сам, поэтому мне хотелось бы думать, что я могу кодировать, но я просто не могу понять, что переоценивает цвет шрифта ... Я думаю, что это строка 73 файла new_menu_style.css.

Answer 1

Вы должны попробовать добавить это в CSS:

.menu ul li:hover ul li a {
    color: #ccc;
}
.menu ul li:hover ul li a:hover {
    color: black;
}

.menu ul li:hover a получает больший вес, чем другой, переопределяя его.

Answer 2

Первое: сделайте что-нибудь с вашим стилем кода. правильный отступ делает большое усилие для улучшения читабельности:

Итак, вот решение: добавьте это к вашему CSS, так как они переопределяют .menu ul li:hover a

.menu ul li:hover ul a {
    color:#ccc
}
.menu ul li:hover ul li:hover a {
    color:#000
}