我有一个情况下,我必须写内联CSS代码,我想应用悬停样式的锚。

我如何使用一个:悬停在内联CSS内的HTML样式属性?

例如,你不能可靠地在HTML电子邮件中使用CSS类。


当前回答

这是不可能的。您可以选择使用JavaScript或CSS块。

也许有一些JavaScript库可以将私有样式属性转换为样式块。但是这样代码就不符合标准了。

其他回答

你可以在过去的某个时候这样做。但现在(根据同一标准的最新修订,即候选人推荐)你不能这样做了 .

如果您确实需要内联代码,则可以这样做。我需要它的一些悬停按钮,方法是这样的:

.hover-item { background - color: # FFF; } .hover-item:{徘徊 background - color:继承; } <a style="background-color: red;"> < div class = " hover-item”> 内容 < / div > < /

在本例中,内联代码:"background-color: red;"是悬停时的开关颜色。用你需要的颜色,然后这个解决方案。我意识到,就兼容性而言,这可能不是完美的解决方案,但如果绝对需要,这是可行的。

所以这并不是用户想要的,但是我发现这个问题是在寻找答案,并且找到了一些相关的东西。我有一堆重复的元素,需要一个新的颜色/悬停在其中的标签。我使用句柄,这是我的解决方案的关键,但其他模板语言也可以工作。

我定义了一些颜色,并将它们传递到每个元素的handlebars模板中。在模板的顶部,我定义了一个样式标签,并放入自定义类和悬停颜色。

<style type="text/css">
    .{{chart.type}}-tab-hover:hover {
        background-color: {{chart.chartPrimaryHighlight}} !important;
    }
</style>

然后我使用模板中的样式:

<span class="financial-aid-details-header-text {{chart.type}}-tab-hover">
   Payouts
</span>

您可能不需要!important

我只是想出了一个不同的解决方案。

My issue: I have an <a> tag around some slides/main content viewer as well as <a> tags in the footer. I want them to go to the same place in IE, so the whole paragraph would be underlined onHover, even though they're not links: the slide as a whole is a link. IE doesn't know the difference. I also have some actual links in my footer that do need the underline and color change onHover. I thought I would have to put styles inline with the footer tags to make the color change, but advice from above suggests that this is impossible.

解决方案:我给了脚注链接两个不同的类,我的问题就解决了。我能够有onHover的颜色改变在一个类,有幻灯片onHover没有颜色变化/下划线,仍然能够有外部href在页脚和幻灯片在同一时间!

我同意影子的说法。您可以使用onmouseover和onmouseout事件通过JavaScript更改CSS。

不要说人们需要激活JavaScript。这只是一个风格问题,所以如果有一些访问者没有JavaScript也没关系;) 尽管大多数Web 2.0都使用JavaScript。例如Facebook(大量JavaScript)或Myspace。