内联样式用作:在CSS中悬停
内联样式用作:在CSS中悬停
提问于 2008-09-25 05:51:40
我知道将CSS样式直接嵌入到它们所影响的HTML标记中会违背CSS的大部分目的，但有时它对于调试目的很有用，例如：
<p style="font-size: 24px">asdf</p>嵌入如下规则的语法是什么：
a:hover {text-decoration: underline;}转换为A标记的样式属性？显然不是这个..。
<a href="foo" style="text-decoration: underline">bar</a>...since将始终适用，而不是仅在悬停期间应用。
回答 6
Stack Overflow用户
发布于 2008-09-25 05:59:56
如果您只是在调试，则可以使用javascript来修改css：
<a onmouseover="this.style.textDecoration='underline';"
onmouseout="this.style.textDecoration='none';">bar</a>Stack Overflow用户
发布于 2014-08-16 04:45:28
一个简单的解决方案：
<a href="#" onmouseover="this.style.color='orange';" onmouseout="this.style.color='';">My Link</a>或
<script>
/** Change the style **/
function overStyle(object){
object.style.color = 'orange';
// Change some other properties ...
}
/** Restores the style **/
function outStyle(object){
object.style.color = 'orange';
// Restore the rest ...
}
</script>
<a href="#" onmouseover="overStyle(this)" onmouseout="outStyle(this)">My Link</a>Stack Overflow用户
发布于 2008-09-25 06:08:41
如果是为了调试，只需添加一个用于悬停的css类(因为元素可以有多个类)：
a.hovertest:hover
{
text-decoration:underline;
}
<a href="http://example.com" class="foo bar hovertest">blah</a>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/131653
复制相关文章
相似问题