CSS的混色模式

阅读量：

该 mix-blend-mode 属性明确了当前元素与其直接父级元素及其背景之间的混合方式。

通常情况下，在网站设计中当主题背景与图片主色调色差较大时，则采用图层混合模式进行颜色平衡的调整；同时这种模式同样也可以用来处理成黑白图像

语法：

mix-blend-mode:normal; //默认值

复制代码

    **属性：**

Photoshop图层	CSS混合模式	中文名称	功能描述
normal	normal	正常模式	混合色的像素会透过所用的颜色显示出来
multiply	multiply	正片叠底模式	在“正片叠底”模式中，查看每个通道中的颜色信息，并将“基色”与“混合色”复合。
screen	screen	滤色模式	“滤色”模式与“正片叠底”模式正好相反，它将图像的“基色”颜色与“混合色”颜色结合起来产生比两种颜色都浅的第三种颜色
overlay	overlay	叠加模式	“叠加”模式把图像的“基色”颜色与“混合色”颜色相混合产生一种中间色。
darken	darken	变暗模式	在“变暗”模式中，查看每个通道中的颜色信息，并选择“基色”或“混合色”中较暗的颜色作为“结果色”。
lighten	lighten	变亮模式	在“变亮”模式中，查看每个通道中的颜色信息，

全部评论 (0)

还没有任何评论哟~