Question

我有一个带有锚标记的列表项。

我想将hover伪选择器添加到列表项中，因此在其中添加锚标记。

我的目标是在将鼠标悬停在列表项上时更改锚标记文字的颜色。

li:hover{
    background-color: #000;
    color:#fff;
    width: 60px;
    color:#fff;
}

<li>
    <a href="#">one</a>
</li>

JSFIDDLE

虽然似乎没有用，但我在这里做错了什么？

Answer 1

您正在寻找的选择器是

li:hover a {
  /* hover color here */
}

<强> DEMO

＆＃13;

a {
  color: green;
}
li:hover a {
  color: red;
}

＆＃13;

<ul>

  <li>
    <a href="#">one</a>
  </li>
  <li>
    <a href="#">two</a>
  </li>
  <li>
    <a href="#">three</a>
  </li>
  <li>
    <a href="#">four</a>
  </li>
  <li>
    <a href="#">five</a>
  </li>

</ul>

＆＃13;

悬停伪选择器未按预期工作

1 个答案: