设置图片的透明度即可
img{opacity:0.5
filter:alpha(opacity=50) /* 针对 IE8 以及更早的版本 */
}
一般我们的复选框长成下面这样，现在要求你切深色模式的时候，更改复选框选中的强调色为粉色。
审查元素，你发现 Checkbox 是原生 HTML 标签写的，这个时候你挠挠头，想了想 CSS 好像没有更改强调色的属性，没办法，只能自己来自定义了，但是重新自己写问题很大，从头开始构建它最终会比预期的工作多得多，即使用第三方框架也不是最理想的解决方案，浏览器万一更新新增效果就扯犊子了。
最好的解决方案还是利用 CSS 属性来解决。这就是我们的主角：
接下来给出实现的源码：
问题来了，这么好用的 CSS 属性，难道就只支持复选框吗？那肯定不成本着好东西多用，它支持四个元素： checkbox 、 radio 、 range 和 progress 。每个都可以在此处以浅色和深色配色方案预览 https://accent-color.glitch.me 。
通过 https://caniuse.com/?search=accent-color 查询 accent-color 的兼容性很一般，但是你要知道，即使是不支持的浏览器，你写了 CSS 语法是不会报错的，所以作为增强使用完全没问题。
1、如果想改变css背景图片，一般的做法只能使用css滤镜；2、css滤镜主要包括：
Speia滤镜 灰度图滤镜 高斯模糊滤镜 反色滤镜 饱和度滤镜
对比度滤镜亮度滤镜色相旋转滤镜 阴影滤镜
3、css滤镜在浏览器兼容是比较坑爹的问题，ie浏览器有自己一套滤镜filter家族，基本所有ie内核浏览器都支持，ff和Chrome，opera则主要使用css3的滤镜，这些浏览器在后期版本支持css3的滤镜（目前版本基本都支持html5和css3），通过滤镜改变背景图的颜色和效果，当然这些滤镜主要是为了效果而产生，颜色只是固定的几种效果。
4、个别时候，css滤镜还需要结合js使用，才能到达必要效果，其实一般背景图片都是用透明度的css来设置它的颜色度；
透明度css列子：
transparent_class {
filter:alpha(opacity=50)
-moz-opacity:0.5
-khtml-opacity: 0.5
opacity: 0.5
}
