为另一个属性设置较暗或较浅的背景颜色

变暗

#demo {
  @refcolor: #f0b9b8;
  background: @refcolor;
  border: 1px solid darken(@refcolor, 25%);
}

上面的代码利用 darken() 函数将边框颜色设置为比参考颜色（也是背景颜色）暗 25％的阴影。

较少的编译器无法读取分配给一个属性的值并将其用于另一个属性，因此应定义单独的变量。此变量将直接分配给背景颜色，而对于边框颜色，darken 功能用于获得更暗的阴影。

减轻

#demo {
  @refcolor: #f0b9b8;
  background: @refcolor;
  box-shadow: 2px 2px 0px lighten(@refcolor, 5%);
}

上面的代码利用 lighten() 函数将阴影颜色设置为比参考颜色（也是背景颜色）轻 5％的阴影。