2

可能重复：
如何在内联 CSS 中编写 a:hover？

我需要生成一些自包含的 HTML 代码，所以我不能使用任何外部样式表或样式标记。

要求之一是链接必须具有hover,visited状态等。我知道如何使用样式表来做到这一点，但我怎样才能内联呢？即我应该在样式属性中添加什么：

<a style="???" href="http://example.com">Link</a>
4

2 回答 2

1

您可以使用 Javascript 对其进行管理：

var links = document.getElementsByTagName("a");

for(var i = 0; i < links.length; i++) {
    if(links[i].className == "hoverThis") {
      DoHover(links[i]);
    }
}

function DoHover(link_element){
  link_element.onmouseover = function(){
    this.style.display = "block";
  }

  link_element.onmouseout = function(){
    this.style.display = "none";
  }
}

只需将适当的类（在此示例中为“hoverThis”）添加到您想要过度效果的链接元素，并根据需要更改效果。

于 2011-08-06T11:35:48.610 回答
1

对于那些感兴趣的人，我最终<style>在我的代码之前添加了一个标签：

<style>.my-link:hover { text-decoration:underline !important; }</style>

这不是标准的，因为<style>标签应该在<head>. 但是它适用于最新版本的 IE、Firefox、Safari 和 Chrome。无论如何可能发生的最糟糕的情况是 :hover 状态不会在选定的链接上工作。

于 2011-08-06T11:37:21.043 回答