Question

我尝试使用属于其祖父母的背景颜色来设置元素的背景颜色，但是然后将其父颜色设置为具有不同的颜色。这可能吗？

我认为将其父级设置为inherit，然后将元素设置为inherit以级联＆＃39;它可以工作，然后我可以自由地改变父母的背景颜色，但这没有用。

以下是我试图完成的精简版。

＆＃13;

div {
  background-color: #e00;
}
span.foo {
  background-color: inherit;
}
span.bar {
  background-color: inherit;
}
span.foo {
  background-color: #777;
}

＆＃13;

<div>
  <span class="foo">
    Hello
    <span class="bar">
      World
    </span>
  </span>
</div>

＆＃13;

Answer 1

您无法使用CSS执行您想要的操作，但您的问题也证明您对CSS的工作原理有不正确的认识，因此解释您为何无法执行所需操作非常重要：< / p>

CSS 不是一种编程语言 - 它没有一个串行的操作模型 - 这样做，然后就像编程语言一样。

CSS是一种描述语言 - 它允许您在没有时间函数的情况下描述对象的属性。那就是 - 当你说＆＃34;继承＆＃34;在CSS中，它并不意味着＆＃34;复制价值并维护自己的副本＆＃34;，这意味着＆＃34;这个值与父母完全一样，并且它总是与专利完全一样，即使父母改变＆＃34; - 因为它不是一个操作，它是对事物的描述。

另一个例子是你写的东西：

p { color: green; }
p { color: red; }

它并不意味着＆＃34;使用绿色绘制文本，然后使用红色＆＃34; - 它意味着＆＃34;设计师认为他希望文本变绿，然后决定红色更好 - 所以总是用红色＆＃34;来绘制文本。

如果您真的想要复制另一个元素的值然后更改源元素，那么您需要使用编程语言 - 尽管我认为如果您尝试思考它是最好的通过仅使用CSS的描述性属性来获得所需样式的方法。

Answer 2

你可以在页面加载时使用jquery来实现它，即：

<script>

$(document).ready(function(){

var divColor = $("div").css("background-color");
$(".bar").css("background-color", divColor);

});

</scipt>

希望这有帮助。

我可以使用祖父母的属性设置元素样式，但是将其父设置为不同吗？

2 个答案: