用于锚标记和悬停的内联 CSS
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7047692/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Inline CSS for anchor tag and hover
提问by John R
I'm under the impression that changing an anchor tag on hover can be done like this:
我的印象是在悬停时更改锚标记可以这样完成：
a:hover {background: #FFDD00;}
a:hover {color: #AAAAAA;}
Correct me if I'm wrong.
如果我错了纠正我。
Now, for some convoluted reason, I can't put that code in a style sheet, I have to put it in the actual HTML. How would I do that?
现在，由于某些令人费解的原因，我不能将该代码放入样式表中，我必须将其放入实际的 HTML 中。我该怎么做？
<a href="..." style="___???___">...</a>
采纳答案by thirtydot
There's no way to do that.
没有办法做到这一点。
Inline CSS can't touch pseudo-classes such as :hover.
内联 CSS 不能触及伪类，例如:hover.
I'm guessing the reason you want to do this is because you can only edit the <body>of the HTML (for whatever reason). What you cando is add a styleelement:
我猜你想这样做的原因是因为你只能编辑<body>HTML 的（无论出于何种原因）。您可以做的是添加一个style元素：
<style>
a:hover {
background: #FFDD00;
color: #AAAAAA;
}
<style>
<a href="#">...</a>
Having a styleelement outside the <head>is not valid HTML, but (crucially) it does work in all browsers.
在style之外的元素<head>不是有效的 HTML，但（至关重要）它在所有浏览器中都有效。
回答by ninjascript
If you can't toss your hover CSS into a tag, then the best way to handle this is going to be JavaScript. I wouldn't ordinarily call this a good approach, but it sounds like your hands are tied here.
如果您无法将悬停 CSS 放入标签中，那么处理此问题的最佳方法将是 JavaScript。我通常不会称这是一个好方法，但听起来你的手被绑在这里了。
<a href="..."
onmouseover="this.style.backgroundColor='#ffdd00';this.style.color='#aaaaaa'"
onmouseout="this.style.backgroundColor='transparent';this.style.color='inherit'">
...
</a>
Hope that works for you!
希望对你有用！
回答by Guy
Found this in an old forum and it seems to work great :)
在一个旧论坛中找到了这个，它似乎很好用 :)
<a href="###" style="text-decoration: none;" onmouseover="this.style.textDecoration = 'underline'" onmouseout="this.style.textDecoration = 'none'">###</a>
回答by Fenton
You can put both styles in the same block, like this.
您可以将两种样式放在同一个块中，就像这样。
a:hover {
background: #FFDD00;
color: #AAAAAA;
}
And if you cannot use an external stylesheet, you can add a style block to the head of your page...
如果您不能使用外部样式表，您可以在页面的头部添加一个样式块...
...
<style>
a:hover {
background: #FFDD00;
color: #AAAAAA;
}
</style>
</head>
...
回答by Joseph Marikle
I'm pretty sure you can't apply psudo-classes inline, but you can do this with javascript inline.
我很确定您不能内联应用 psudo-classes，但是您可以使用内联 javascript 来做到这一点。
e.g.
例如
<a href="..." onmouseover="this.style.color = 'red'" onmouseout="this.style.color = 'black'">...</a>
回答by umbregachoong
It would be better to follow the suggestions put forth above in an external style sheet, but for whatever reason you really need to do it, try this:
最好遵循上面在外部样式表中提出的建议，但无论出于何种原因您确实需要这样做，请尝试以下操作：
a href="" style="text-decoration:underline;color:blue;"
a href="" style="text-decoration:underline;color:blue;"
