brightness()
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2016年9月.
brightness() CSS函数将线性乘数应用于输入图像，使其看起来更亮或更暗。结果是一个<filter-function>.
尝试一下
filter: brightness(1);
filter: brightness(1.75);
filter: brightness(50%);
filter: brightness(0);
<section id="default-example">
<img
class="transition-all"
id="example-element"
src="/shared-assets/images/examples/firefox-logo.svg"
width="200" />
</section>
语法
brightness(amount)
值
amount-
输出的亮度值取决于
<number>或<percentage>的大小。低于100%的值会使图片变暗，超过100%的值将会使其变亮。当值为0%时将会创建一个全黑的图像，当值为100%时不会有任何变化。该值为空时默认为1.
例子
css
brightness(0%) /* 全黑 */
brightness(0.4) /* 40% 亮度 */
brightness(1) /* 无效果 */
brightness(200%) /* 两倍亮度 */