Question

我想在列表项的鼠标悬停时更改国家/地区的字体颜色。我提到了这个工作codepen，但在我的方案中它没有用。我无法找出我犯了错误的地方这是我的代码

＆＃13;

a{
text-decoration:none;
}
li{
list-style:none;
}
.dropdown-menu>li>a:hover + .dropdown>.dropdown-toggle{
    color: yellow!important;
}

＆＃13;

     <span>
         <li class="dropdown inline">
            <a class="dropdown-toggle" href="#">Country <span class="caret"></span></a>(Color will be changed on hover of countries)
            <ul class="dropdown-menu">
               <li><a href="#">India</a></li>
               <li><a href="#">USA</a></li>
               <li><a href="#">Japan</a></li>
               <li><a href="#">Korea</a></li>
            </ul>
         </li>
      </span>

＆＃13;

Answer 1

见下面的代码片段，这就是你想要的

＆＃13;

a{
text-decoration:none;
}
li{
list-style:none;
}
.dropdown:hover  >.dropdown-toggle{
    color: yellow!important;
}

＆＃13;

<span>
         <li class="dropdown inline">
            <a class="dropdown-toggle" href="#">Country <span class="caret"></span></a>(Color will be changed on hover of countries)
            <ul class="dropdown-menu">
               <li><a href="#">India</a></li>
               <li><a href="#">USA</a></li>
               <li><a href="#">Japan</a></li>
               <li><a href="#">Korea</a></li>
            </ul>
         </li>
      </span>

＆＃13;

带有锚标记的列表项的CSS元素+元素选择器

1 个答案: