html - 如何写一个 :hover in inline CSS?

Question

我有一个案例，我必须编写内联 CSS 代码，并且我想在 anchor 上应用悬停样式。

如何在 HTML 样式属性内的内联 CSS 中使用 a:hover？

例如您无法在 HTML 电子邮件中可靠地使用 CSS 类。

Answer 1

简短的回答:你不能。

长答案:你不应该。

给它一个类名或一个 id 并使用样式表来应用样式。

:hover 是一个伪选择器，对于 CSS , 只在样式表中有意义。没有任何等效的内联样式(因为它没有定义选择标准)。

对 OP 评论的回应:

见 Totally Pwn CSS with Javascript 关于动态添加 CSS 规则的好脚本。另见 Change style sheet 关于该主题的一些理论。

另外，别忘了，如果可以的话，您可以添加指向外部样式表的链接。例如，

<script type="text/javascript">
  var link = document.createElement("link");
  link.setAttribute("rel","stylesheet");
  link.setAttribute("href","http://wherever.com/yourstylesheet.css");
  var head = document.getElementsByTagName("head")[0];
  head.appendChild(link);
</script>

注意:以上假设有 head部分。