时间戳

首页 > 解决方案 > 当DOM同时具有.red和.yellow时，CSS如何制作颜色：橙色？

css - 当DOM同时具有.red和.yellow时，CSS如何制作颜色：橙色？

问题描述

例如我有一个像这样的 div：

<div class="red yellow"><div>

和我的CSS：

.red{background-color:red;}
.yellow{background-color:yellow;}

当我的 div 同时具有 .red 和 .yellow 类时，如何使我的 div 的背景颜色变为橙色？我认为类似的方式是：

.red .yellow{background-color:orange;}

我知道这不是正确的方法，但我怎样才能归档我的要求？

标签： csssass

解决方案

试试这个方法。两个类名之间不应有空格。

.red.yellow { background-color:orange; }

请参阅此片段。

.red { background-color:red; }
.yellow { background-color:yellow; }
.red.yellow { background-color:orange; }
<div class="red">Red</div>
<div class="yellow">Yellow</div>
<div class="red yellow">Orange</div>

推荐阅读