gpt4 book ai didi

css - 使用css的负饱和度

转载 作者:太空宇宙 更新时间:2023-11-04 04:11:09 25 4
gpt4 key购买 nike

我正在裁剪 Photoshop 网页布局。我有以下过滤器,我想在 css 中应用(我不想使用已应用过滤器的图像)。

所以我使用这些 css 属性生成了以下 HSL (-64, -67, 0):

-webkit-filter: hue-rotate(-64deg);
-webkit-filter: saturate(-67%);

但是,有一个问题,因为如果饱和度小于 0%,浏览器似乎会将其裁剪为 0%。

如何使用 css 实现负饱和度?

filter

最佳答案

有效值只能从 0% 到 100%

https://developer.mozilla.org/en-US/docs/Web/CSS/filter#saturate()

CSS中的HSL也是如此

http://www.w3.org/TR/css3-color/#hsl-color

您只需找出 PhotoShop 使用的比例并进行相应调整。如果你正在使用像 SASS 或 LESS 这样的预处理器,你可以在那里做。因此,如果 PhotoShop 从 -100% 变为 100%,您可以执行 (100% + $val)/2

(您也可以使用 CSS calc ,但这种情况更适合预处理器,甚至是手动计算 - 请务必发表评论!)

关于css - 使用css的负饱和度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20642871/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com