仅需一个 CSS 属性即可移除任何图像的背景。
该属性支持大多数现代浏览器。
假设遇到以下情况：
已构建了一个完美的响应式布局，但部分图像的背景与网站背景不匹配，如下例所示：
图像背景色与预期色差明显。
通常，可能首先想到的解决方案是调整设计，使网站背景色与商品图背景色匹配。但更优解在于 CSS 的 mix-blend-mode（混合模式）属性。
实现原理：
将图像置于具有独立背景色的 div容器中对图像应用 mix-blend-mode: darken属性浏览器会对容器背景与图像背景进行像素级颜色比对
当采用 darken 混合模式时，系统将保留两个像素中较暗者。若容器背景色比图像背景色更深，则前者将覆盖后者。
颜色比对原理
判断颜色深浅的简易方法：
将颜色转换为 HSL 模式（色相/饱和度/明度） 比较明度值（Lightness）：明度值越低则颜色越深
优化后的电商网站效果
这个简短的小技巧能帮助你更高效地处理图像问题。
优网科技，优秀企业首选的互联网供应服务商
优网科技秉承"专业团队、品质服务" 的经营理念，诚信务实的服务了近万家客户，成为众多世界500强、集团和上市公司的长期合作伙伴！
优网科技成立于2001年，擅长网站建设、网站与各类业务系统深度整合，致力于提供完善的企业互联网解决方案。优网科技提供PC端网站建设（品牌展示型、官方门户型、营销商务型、电子商务型、信息门户型、DIY体验、720全景展厅及3D虚拟仿真）、移动端应用（手机站、APP开发）、微信定制开发（微信官网、微信商城、企业微信）、微信小程序定制开发等一系列互联网应用服务。
公安局备案号：
专属顾问
