我有一个情况下,我必须写内联CSS代码,我想应用悬停样式的锚。
我如何使用一个:悬停在内联CSS内的HTML样式属性?
例如,你不能可靠地在HTML电子邮件中使用CSS类。
我有一个情况下,我必须写内联CSS代码,我想应用悬停样式的锚。
我如何使用一个:悬停在内联CSS内的HTML样式属性?
例如,你不能可靠地在HTML电子邮件中使用CSS类。
当前回答
你可以通过在onMouseOver和onMouseOut参数中使用JavaScript更改样式来获得相同的效果,尽管如果你需要更改多个元素,这是非常低效的:
<a href=“abc.html” onMouseOver=“this.style.color='#0F0'” onMouseOut=“this.style.color='#00F'” >Text</a>
另外,我不太确定这在这里是否适用。你可能需要用document.getElementById('idForLink')来切换它。
其他回答
我同意影子的说法。您可以使用onmouseover和onmouseout事件通过JavaScript更改CSS。
不要说人们需要激活JavaScript。这只是一个风格问题,所以如果有一些访问者没有JavaScript也没关系;) 尽管大多数Web 2.0都使用JavaScript。例如Facebook(大量JavaScript)或Myspace。
你可以通过在onMouseOver和onMouseOut参数中使用JavaScript更改样式来获得相同的效果,尽管如果你需要更改多个元素,这是非常低效的:
<a href=“abc.html” onMouseOver=“this.style.color='#0F0'” onMouseOut=“this.style.color='#00F'” >Text</a>
另外,我不太确定这在这里是否适用。你可能需要用document.getElementById('idForLink')来切换它。
使用JavaScript:
a)增加内联样式
document.head.insertAdjacentHTML('beforeend', '<style>#mydiv:hover{color:red;}</style>');
B)或者更难一点的方法——添加“鼠标悬停”
document.getElementById("mydiv").onmouseover= function(e){this.className += ' my-special-class'; };
document.getElementById("mydiv").onmouseleave= function(e){this.className = this.className.replace('my-special-class',''); };
注意:JavaScript中的多词样式(即font-size)是一起编写的:
element.style.fontSize="12px"
正如所指出的,你不能为悬停设置任意的内联样式,但你可以在CSS中使用以下方法在适当的标签中更改悬停光标的样式:
style="cursor: pointer;"
它不是内联CSS,但它是内联的。
<a href=“abc.html” onMouseOver=“this.style.color='#0F0'” onMouseOut=“this.style.color='#00F'”>Text</a>