CSS 文本装饰:反向

2024-05-08

我很惊讶 CSS 中没有“text-decoration:reverse”,因为使用 JavaScript 来实现似乎非常尴尬。 IE。将元素的前景色和背景色分别设置为父元素的背景色和前景色。

我注意到了 JavaScript 技术here http://www.ruzee.com/blog/2006/07/retrieving-css-styles-via-javascript/

当然事情没那么复杂吧?


你说的恢复是什么? 您的意思是将背景设置为前景色,反之亦然吗? (也许这是一个愚蠢的评论,但如果是这样的话,它就不是装饰品了,不是吗?)

无论如何,您将在这里进行 DRY 和 MVC 之间的斗争:

  • 要么声明一个新的 CSS 类 每次你想这么做的时候。那是 多余又痛苦,但你确实 将样式与代码分开。

通常:

.mydiv {
   background-color: blue;
   color: red;
   font-family:...;
   (...)
}


.mydiv:hover {
   color: red;
   background-color: blue;
}
  • 另一种选择是通过 JavaScript 来做到这一点。 Proxify 建议使用 jQuery。

    结果可能看起来像这样......(未经测试)

$(".invert").map(function (el) {
       var color = el.css("color");
       var bgcolor = el.css("background-color");
       el.css("color", bgcolor).css("background-color",color);
    })
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

CSS 文本装饰:反向 的相关文章