【转载】巧用CSS cross-fade()实现背景图像半透明效果

原文摘要： 

这世界上没有所谓的没有用的CSS属性，只是没有遇到合适的场景而已。

 

某元素，希望background-image背景图片是半透明的，但是，元素里面的其他内容，例如文字，图标之类的还是不透明。

如果是纯色背景或者是CSS渐变背景，很好处理，使用rgba或者hsla颜色色值即可。

但是，如果是url()背景图像，似乎就无能为力了。

有没有什么好的实现方法呢？

试试使用cross-fade()图像函数。

 

文章转载自 张鑫旭-鑫空间-鑫生活 http://www.zhangxinxu.com/

原文链接：https://www.zhangxinxu.com/wordpress/2020/07/css-cross-fade-background-image-opacity/