我有一个情况下,我必须写内联CSS代码,我想应用悬停样式的锚。
我如何使用一个:悬停在内联CSS内的HTML样式属性?
例如,你不能可靠地在HTML电子邮件中使用CSS类。
我有一个情况下,我必须写内联CSS代码,我想应用悬停样式的锚。
我如何使用一个:悬停在内联CSS内的HTML样式属性?
例如,你不能可靠地在HTML电子邮件中使用CSS类。
当前回答
正如所指出的,你不能为悬停设置任意的内联样式,但你可以在CSS中使用以下方法在适当的标签中更改悬停光标的样式:
style="cursor: pointer;"
其他回答
你可以通过在onMouseOver和onMouseOut参数中使用JavaScript更改样式来获得相同的效果,尽管如果你需要更改多个元素,这是非常低效的:
<a href=“abc.html” onMouseOver=“this.style.color='#0F0'” onMouseOut=“this.style.color='#00F'” >Text</a>
另外,我不太确定这在这里是否适用。你可能需要用document.getElementById('idForLink')来切换它。
在当前的CSS迭代中不支持内联伪类声明(不过,据我所知,在未来的版本中可能会支持)。
现在,你最好的办法可能是直接在你想要样式的链接上方定义一个样式块:
<style type="text/css">
.myLinkClass:hover {text-decoration:underline;}
</style>
<a href="/foo" class="myLinkClass">Foo!</a>
你可以做到的。但不是内联样式。你可以使用onmouseover和onmouseout事件:
<div style="background: #333;填充:10 px;光标:指针” onmouseover = " this.style.backgroundColor =“# 555”;“onmouseout = " this.style.backgroundColor =“# 333”;" > 在我身上盘旋! < / div >
简单的回答是:你不能。
长话短说:你不应该。
给它一个类名或id,并使用样式表应用样式。
:hover是一个伪选择器,对于CSS来说,它只在样式表中有意义。没有任何内联样式的对等物(因为它没有定义选择标准)。
回应行政长官的评论:
关于动态添加CSS规则的好脚本,请参阅完全Pwn CSS with Javascript。关于这个主题的一些理论,请参见Change样式表。
另外,不要忘记,如果可以的话,还可以添加到外部样式表的链接。例如,
<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>
注意:以上假设有一个头部部分。
你可以像这样使用内联样式表语句:
<style>#T1:hover{color:red}</style><span id=T1>Your Text Here</span>