基于背景颜色变量的条件CSS

本文介绍了基于背景颜色变量的条件CSS的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

是否可以根据较小变量的明暗设置颜色?

Is it possible to set a color based on the lightness/darkness of a less variable?

当前，我有以下代码:

li {
    color: darken(@bodyBackground, 10%);
}

该功能在@bodyBackground为浅色的情况下有效.但是，如果它是深色，我想使用lighten(@bodyBackground, 10%). LESS可以做到吗?

This works providing @bodyBackground is a light color. However if it was a dark color I'd like to use lighten(@bodyBackground, 10%). Is this possible with LESS?

推荐答案

有 contrast 函数，例如:

There's contrast function, e.g.:

li {
    color: contrast(@bodyBackground,
            lighten(@bodyBackground, 13%),
             darken(@bodyBackground, 13%));
}

这篇关于基于背景颜色变量的条件CSS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！