html - 如何改变一个将鼠标悬停在其中的标签上时的项目符号图标？

Question

在我的<ul>列表中，我有几个<li>带有<a>标签。

我想在<a>标签上悬停时更改 li 项目符号图标的颜色（我的意思是旁边的项目符号<li>）

我试过

a:hover {
    color:red;
}

但它不会影响<li>项目符号图标。

我也试过

ul li:hover{
    color:red;
}

但它不能完美地工作，因为当鼠标移动到<a>标签附近而不是它时<li>，子弹开始改变颜色。

标签： htmlcss

Answer 1

你的代码实际上对我有用。

<ul>
  <li>
    <a href="#">A</a>
  </li>
  <li>
    <a href="#">B</a>
  </li>
  <li>
    <a href="#">C</a>
  </li>
</ul>

CSS：

ul li:hover{
  color:red;
}

小提琴：https ://jsfiddle.net/tox9je8n/