使用LESS，我需要根据在其body标签中设置的类设置许多后置元素的颜色。
例如
<body class="color-a">
<h2 class="news-heading">Hi Buddy</h2>
<p class="news-body">How are you doing?</p>
</body>
我有很多颜色，a色，b色，c色，d色等，一路到20种不同的变化。
使用嵌套的选择器，每个类的颜色被写入20次。
例如
.color-a .news-heading { color:blue; }
.color-b .news-heading { color:red; }
.color-c .news-heading { color:green; }
编写此内容的最佳方法是什么？
作为另一个答案所述，color自动继承（如本例所示），但是这是假设没有其他设置color的的h2元素（你的.news-heading）。如果css将此color元素的设置在其他地方（如本示例），则您将需要覆盖。是的，您可以按原样覆盖它，进行20个不同的类调用以显式覆盖（例如）每种颜色，但是最好像下面的代码那样在单个调用中进行覆盖，那么无论如何color在上body，因为它将把它color当作自己的。当然，只有您的选择器具有足够高的特异性以赢得选择战时，它才会这样做。
.news-heading {color: inherit;}
现在，尽管color（您的特定情况）通常自动继承，但许多属性没有，但是仍然可以将其设置inherit为值。请参阅允许的值以及继承是否为默认值的列表。目前，我相信所有属性都可以显式设置为inherit。
因此，对于您的问题的更笼统的回答是，无论您要继承的“一个特定属性”是什么，您都可以像上面一样进行设置。因此，您可以（理论上）执行以下操作：
.myClass {
background: inherit;
border-style: inherit;
border-color: inherit;
border-width: inherit;
float: inherit;
}
请参阅小提琴示例。请注意，这background: inherit与简单地background通过透明子项来查看父项（透明是默认设置；某些人可能会认为是继承，但不是）是不同的。在示例中，您应该能够看到background继承它的孩子与未继承孩子的轻微转变。这是因为背景实际上是从父元素顶部上方的子元素的左上角（在本例中）重新绘制自身。
请注意，继承是从直接父级继承的。如果不先将父对象设置为继承，就不能从祖父母元素继承。请参阅此示例。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句