仅需一个 CSS 属性即可移除任何图像的背景。
该属性支持大多数现代浏览器。
假设遇到以下情况：
已构建了一个完美的响应式布局，但部分图像的背景与网站背景不匹配，如下例所示：
图像背景色与预期色差明显。
通常，可能首先想到的解决方案是调整设计，使网站背景色与商品图背景色匹配。但更优解在于 CSS 的 mix-blend-mode（混合模式）属性。
实现原理：
将图像置于具有独立背景色的 div容器中对图像应用 mix-blend-mode: darken属性浏览器会对容器背景与图像背景进行像素级颜色比对
当采用 darken 混合模式时，系统将保留两个像素中较暗者。若容器背景色比图像背景色更深，则前者将覆盖后者。
颜色比对原理
判断颜色深浅的简易方法：
将颜色转换为 HSL 模式（色相/饱和度/明度） 比较明度值（Lightness）：明度值越低则颜色越深
优化后的电商网站效果
这个简短的小技巧能帮助你更高效地处理图像问题。
優(yōu)網(wǎng)科技，優(yōu)秀企業(yè)首選的互聯(lián)網(wǎng)供應服務商
優(yōu)網(wǎng)科技秉承"專業(yè)團隊、品質服務" 的經(jīng)營理念，誠信務實的服務了近萬家客戶，成為眾多世界500強、集團和上市公司的長期合作伙伴！
優(yōu)網(wǎng)科技成立于2001年，擅長網(wǎng)站建設、網(wǎng)站與各類業(yè)務系統(tǒng)深度整合，致力于提供完善的企業(yè)互聯(lián)網(wǎng)解決方案。優(yōu)網(wǎng)科技提供PC端網(wǎng)站建設（品牌展示型、官方門戶型、營銷商務型、電子商務型、信息門戶型、微信小程序定制開發(fā)、移動端應用（手機站、APP開發(fā)）、微信定制開發(fā)（微信官網(wǎng)、微信商城、企業(yè)微信）等一系列互聯(lián)網(wǎng)應用服務。
公安局備案號：
專屬顧問
