实现HTML元素鼠标覆盖背景颜色更改的最简单方法是什么?

根据您的目标浏览器,您可以使用 hover

a.button {
    background-color: orange;
    margin: .2cm;
    padding: .2cm;
    color: black;
    font-family: sans-serif;
    text-decoration: none;
    font-weight: bold;
    border: solid #000000;
}

a.button:hover {
    background-color: darkGoldenRod;
}

w3schools . 看起来它在所有远程现代浏览器上都得到了很好的支持。

sblundy基本上是对的。此外,所有现代浏览器都允许您在<a>然而,IE6不会在任何其他元素上认识到这一点。

$(function(){
  $('.hoverable').hover(function(){
    $(this).addClass('hover');
  },
  function(){
    $(this).removeClass('hover');
  })
})

这将为类为“hoverable”的所有元素在悬停时提供一个悬停类。

a.button, a.button:hover {
    margin: .2cm;
    padding: .2cm;
    color: black;
    font-family: sans-serif;
    text-decoration: none;
    font-weight: bold;
    border: solid #000000;
}

a.button {
    background-color: orange;
}

a.button:hover {
    background-color: darkGoldenRod;
}

以及:

<a class="button" href="">A Button</a>

jQuery 使事情更简单。