更改背景图像的亮度? [英] Change brightness of background-image?

问题描述

我想知道是否可以更改以下亮度:

I am wondering if it is possible to change the brightness of:

 body{
 background-image:url();
 }

使用 HTML/CSS.之所以想改，是因为我刚做图花了很长时间，但是当我把它放在网站上时，它突然亮了两倍.我对比了原始文件和输入到网站中的文件，它们都是非常不同的蓝色.

Using HTML/CSS. The reason I would like to change it, is because I just spent a rather long time making the image, but when I put it on website, it is suddenly about twice as bright. I have compared the original file and the file that is input into the website and they are both very much different colours of blue.

有什么原因吗，有没有办法改变亮度?

Is there any reason for this, and is there a way I can change the brightness?

谢谢.

推荐答案

这将是一个选项，但它不是很实用，并且在旧浏览器中不起作用:

This would be an option, but it's not very practical and wouldn't work in older browsers:

body:after {
  content: "";
  position: fixed;
  top: 0; bottom: 0; left: 0; right: 0; 
  background: rgba(0,0,0,0.1);
  pointer-events: none;
}

或者为了更好的颜色控制，试试 hsla() 颜色:

Or for even better color control, try hsla() colors:

body:after {
  content: "";
  position: fixed;
  top: 0; bottom: 0; left: 0; right: 0; 
  background: hsla(180,0%,50%,0.25);
  pointer-events: none;
}

实际上，最好在图像编辑器中处理图像，直到获得所需的浏览器结果.

Really, it's better to play with the image in a image editor until you get the browser result you want.

这篇关于更改背景图像的亮度?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！