css - 使 child 的 parent (未知)背景颜色变亮

Question

有没有办法在不知道的情况下以less或(一般为css3)访问 parent 的background-color？

就像是:

.child-class {
    background-color: lighten(parent-background-color, 30%);
}

一个更小的变量将是显而易见的方法，但在这种情况下，我根本不知道父级的 background-color 因为它可以动态设置样式。

有人在她的魔术盒里有东西可以帮忙吗？

Answer 1

编辑:看看 ScottS 对一个可能是你需要的聪明解决方案的回答。

这不能在纯 css 中完成。原因是这些类型的引用可能导致“循环”情况。或者 DOM 必须循环多次以确定最终值的情况。这两种情况都是 css 总是避免的。

现在，如果您的主要目标是定义各种“调色板”并使所有颜色协同工作，您应该研究 CSS 扩展工具，如“SASS”或“LESS”。他们可以让您定义颜色并更改它们并进行其他有用的比较。如果您想要这种灵活性，请查看这些工具。然而，他们不能像你问的那样进行直接比较，因为他们最终只是减少到 css。

这可以使用 JavaScript 轻松完成，使用 jQuery 更容易。当 JavaScript/jQuery 代码可能不是您需要的时候，我不会将这个答案弄乱。