如何在html-tag中使用CSS hover？

Question

我想做这样的事情：

<li style="hover:background-color:#006db9;">

但它不起作用。这可能以某种方式进行，还是我必须在头部或外部css文档中编写css？

Answer 1

内联样式是不可能的，但是（in）着名的onmouseover / onmouseout事件处理程序可以做同样的事情。

<li onmouseover="this.style.backgroundColor='#006db9'" onmouseout="this.style.backgroundColor=''">

警告：连字符的CSS定义必须使用camelCase转换为Javascript，如（css）background-color =（javascript）backgroundColor

Answer 2

使用style属性无法做到这一点。您必须在文档本身或外部文件中使用CSS。

li:hover { background-color:#006db9; }

如果那不是一个选项，那么你将不得不诉诸JavaScript。

Answer 3

AFAIK这不能在没有Javascript的情况下内联完成。您必须按照您的建议将其放入头部或外部样式表中。

正文中的<style>标记也被我所知道的所有浏览器解释但无效，因此不值得推荐。

Answer 4

AFAIK你不能在内联css上使用伪类（：hover，：active等）。

Answer 5

您可以将其嵌套在锚标记<li>中，然后将此样式放在文件的顶部或外部CSS文件中，而不是仅使用<a href="#" class="hoverable">，而不是仅使用a.hoverable:hover{background-color:#006db9} ：

{{1}}

或者您可以使用Javascript来避免使用锚标记。

我建议JQuery。