Question

我试图将鼠标悬停在具有“按钮”类的div内具有“删除”类的按钮上，以更改颜色。如此简单，但是它会更改背景颜色，但不会更改图标的颜色。为什么会这样？

已经尝试了几种不同的方法，但是似乎没有任何效果。

（这是我尝试过的最简单的方法之一-如前所述，它仅适用于背景色。我想用颜色填充图标。）

css

.buttons .remove:hover {
  color: #800000;

html

<ul class="todo">
    <li>This is an item.
      <div class="buttons">
        <button class="remove">
          <input type="image" height="22px" width="22px" src="../html/imagens/Trash-512.png" name="plussign" value="submit" />
        </button>
  </ul>

Answer 1

因此，如果我理解正确，您希望为悬停时的图标背景添加颜色，而不是为整个按钮添加颜色吗？

或者，如果要在悬停时添加背景色，请尝试

.remove:hover {
  background-color: #800000;
}

  <ul class="todo">
        <li>This is an item.
          <div class="buttons">
            <button class="remove">
              <input type="image" height="22px" width="22px" src="http://cdn.onlinewebfonts.com/svg/img_307766.png" name="plussign" value="submit" />
            </button>
   </ul>

如果这没有帮助，请提供一些您已经尝试过的CSS。

悬停图标时如何填充另一种颜色？

1 个答案: