[英]Inherits the color of another div?
I have some topics with different colors 我有一些不同颜色的话题
I want the border div "ItemListHeader" inherits the color of another div "color1" which is not parent(structure HTML bellow) Possible with css or js? 我想要边框div“ ItemListHeader”继承另一个div“ color1”的颜色,该颜色不是父级的(结构HTML波纹管)可能与CSS或JS吗? Thank you,
谢谢,
#color1{ background-color: rgba(11, 114, 180, 1); } #color2{ background-color: rgba(1, 14, 18, 0); } .ItemListHeader{ border-right: 30px solid (inherit); }
<div class="List"> <ul class="Menu"> <li class="topic1"> <div id="color1" class="ColorBaseTopics"></div> <ul class="SubTopic1"> <li> <div class="ItemListHeader"> </div> </li> </ul> </li> <li class="topic2"> <div id="color2" class="ColorBaseTopics"></div> <ul class="SubTopic2"> <li> <div class="ItemListHeader"> </div> </li> </ul> </li> </ul> </div>
It's possible with sass variables sass变量可能
or, as others have mentioned, by giving the two objects the same class 或者,正如其他人提到的,通过给两个对象相同的类
There are tools like LESS , which allow you to compose CSS at a higher level of abstraction . 有LESS之类的工具,可以让您在更高的抽象水平上编写CSS。
Less calls these "Mixins" 少称这些为“ Mixins”
Instead of 代替
/* CSS */
#header {
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
}
#footer {
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
}
You could say 你可以说
/* LESS */
.rounded_corners {
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
}
#header {
.rounded_corners;
}
#footer {
.rounded_corners;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.