过滤器亮度不起作用，CSS答案

【问题标题】：Filter brightness not working, CSS过滤器亮度不起作用，CSS
【发布时间】：2020-10-09 01:00:31
【问题描述】：

我正在尝试降低图像的亮度，基本上使它变暗，并且我正在尝试使用 filter: 亮度来做到这一点，但由于某种原因，图像根本没有变暗。我从 1% 开始，一直到 100%，但图像并没有变暗。我不知道我做错了什么。请看我的代码：

img {
    filter: brightness(50%);
    width: 200px;
    height: 200px;
}

<img src = 'https://static.pexels.com/photos/3164/sea-black-and-white-water-ocean.jpg'>

【问题讨论】：

标签： html css

【解决方案1】：

您的浏览器可能不支持开箱即用的规范。在这种情况下，您应该添加供应商前缀以使其正常工作。

-webkit-filter: brightness(50%);

可能是您正在寻找的。p>

【讨论】：

完美。顺便说一句，我正在使用谷歌浏览器。
哇。有人实际上对我的问题投了反对票。我看不出它有什么问题。这是一个合法的问题。
我对否决票不负责任，但显然有人认为不知道供应商前缀是致命的罪

【解决方案2】：

2020 年 10 月 8 日更新

似乎 CSS 可以很容易地将百分比和小数都理解为亮度过滤器中的百分比。 5年前我最初发布此答案时可能不是这种情况，但现在肯定是这种情况。

此处的来源/文档：https://developer.mozilla.org/en-US/docs/Web/CSS/filter

以下是 2015 年的原始答案：

不要在过滤器中使用百分比。它应该是从 0 到 1 的范围。

img {
    filter: brightness(0.5);
    width: 200px;
    height: 200px;
}

0.5 等于 50%

https://developer.mozilla.org/en-US/docs/Web/CSS/filter

filter: brightness(0.4);     // Does not use percentage
filter: contrast(200%);      // Uses percentage

【讨论】：

那不就是不透明的意思吗？
我试图让它比原来的图像更暗。
对此问题获得 34 票赞成的人提供了答案过滤器：brightness(50%) with percent 而不是小数。来源：stackoverflow.com/questions/11535392/…
根据给定的链接：A value of 0% will create an image that is completely black. A value of 100% leaves the input unchanged.。所以这个答案是完全错误的，至少如果我们将给定的链接作为来源。
@XtremeBiker -- 好电话。似乎 CSS 可以很容易地将百分比和小数理解为 brightness 过滤器中的百分比。 5年前我最初发布这个答案时可能不是这种情况，但现在肯定是这种情况。感谢您指出这一点！