sIFR3:通过CSS而不是JS控制内部的a和a:悬停样式

Question

为了在我的网站上对sIFR功能进行优雅的、退化的和最小的编码，我想尽可能地用CSS定义样式。我要做的是：

·定义一个H3标记，由sIFR3替换。

·H3以不同的颜色出现，取决于其容器，例如：

body.blue-txt h3{ color: #009CDA; }
body.white-txt h3{ color: #FFFFFF; }
body.yellow-txt h3{ color: #FFFF00; }
body.etc....

·H3可能包含一个锚(我知道语义问题，但现在正是这样.对不起)

有设置：

sIFR.useStyleCheck = true;

我以为sIFR3会用我的CSS样式表中正确的颜色显示替换的普通H3文本。到目前为止，还不错:我可以使用sIFR.replace()的css-参数来调整sifr-config.js中的蓝色文本：

sIFR.replace(futura, {
  selector: 'body.blue-txt h3',
  css: 'a {color: #009CDA; }, a:hover { color: #009CDA; text-decoration: underline; }'
});

但这必须对我的sIFR替换中的JS和CSS中的每一个文本颜色进行编码。因此，我想让sIFR.useStyleCheck设置尊重sifr-config.css中的CSS，如下所示：

body.blue-txt h3{ color: #009CDA; }
body.blue-txt h3 a{ color: #009CDA; }
body.blue-txt h3 a:hover{ color: #009CDA; text-decoration: underline; }

只是这个似乎行不通..。链接文本一直弹出为#0000FF，悬停没有下划线。这只是Not A Feature (Yet)，还是我做错了什么？

Answer 1

看起来，v2.0的这个分支就是您所需要的。

http://webdesign.maratz.com/lab/multi_color_sifr/

另一种可能是FLIR图像替换。

http://facelift.mawhorter.net/example-pages/facelift/facelift-links.html

Answer 2

如果我可以建议，为什么不使用@字体？到目前为止，大多数人已经升级到火狐3+，WebKit浏览器(Safari，Chrome等)已经实现了一段时间，甚至IE5.5+也支持@字体。这将解决您的:悬停问题，并将更多的语义和逻辑以及更快，但更好的没有闪存！)

但说实话，除非你专门针对

Answer 3

useStyleCheck对Flash电影中的颜色没有影响。您需要在sIFR.replace()参数中指定所有样式(字体大小除外)。

现在，您可以使用modifyCss回调来根据要替换的元素的当前样式更新应用的CSS。不过，你确实需要自己编写程序。