css – 为什么光($color,50%)解析为白色?

前端之家收集整理的这篇文章主要介绍了css – 为什么光($color,50%)解析为白色?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
这个sass片段:
$red: #f00

$lightred: lighten($red,50%)

body
  background: $lightred

被解析为:

body {
  background: white; }

如果你反而做45%而不是50%,它似乎按预期工作:

$lightred2: lighten($red,45%)
...
background-color: #ffe5e5

为什么这变成白色而不是预期的50%的红色?

你可以看到它在这里http://tinkerbin.com/OefelPoi

(注意 – 保存功能似乎有一个错误,在css区域,再次选择Sass Old Syntax,然后重新运行)

更新 –

结束我想要的是将白色与原始颜色混合以获得有色阴影:

mix($color,white,10%)

解决方法

因为减轻功能是用HSL颜色描述的,你的红色#f90被翻译成hsl(0,100%,50%)

所以减轻($lightred,50%)等于hsl(0,100%)或白色

猜你在找的CSS相关文章