继承颜色,然后使其更暗/更亮

Question

我有两个div,一个是.father,另一个是.child - 如下:

<div class="father">
  <p></p>
</div>

<div class="child">
  <p></p>
</div>

正如你所看到的,孩子不在父亲的内心(对不起,如果这看起来像狗,我唯一的例子就是眨眼).我想做什么; 就是当我给.father一个背景颜色时,可以说"背景颜色:#000".我希望孩子继承颜色黑色但是让它更亮/更暗......

我试图做以下事情:

.child {
  background-color: -20%;
}

我不知道这是否是一种真实的方式,我想这是愚蠢的 - 但我需要分享我的所作所为.我也尝试使用CSS透明度,但这将应用于整个div ...如果div里面有文字怎么办？

因此,例如,我将div .child与另一个div包装在一起,并将该div设为黑色背景,然后将透明度应用于div .child - 但这也将对文本应用透明度!

如果我在周围添加了一个如何使该span继承其中div的颜色？并继承其大小.

Answer 1

vdw*_*ert 3

恐怕你无法在纯 CSS 中做到这一点。当然，除非您使用 RGBA 颜色使其透明。

然而，SASS（和 LESS）中有一个函数可以使颜色变暗/变亮。在这里查看这些函数的参考。有关 SASS/SCSS 的更多信息：http://sass-lang.com/