CSS有16种混合模式：normal （没有混合应用）、color、color-dodge、color-burn、difference、exclusion、hue、luminosity、multiply、overlay、saturate 、screen、lighten 、darken、hard-light 和 soft-light。

background-image和background-color通过我们选择各种混合模式来形成不同的视觉效果。

multiply：将background-image和background- color叠加到一起，可以得到一个颜色更深的background-image。

exclusion：衡量源和目标的亮度，减去亮度更大的区域的色彩。它和difference相似，不同之处在于它会得到对比度较低的效果。

lighten：这个模式与darken相反，它的效果取决于源和背景颜色之间更浅的（色彩）。即将两像素的RGB值进行比较后，取高值成为混合后的颜色，因而总的颜色灰度级升高，造成变亮的效果。

overlay：这是一个复杂的混合模式，通过对目标颜色叠加复合或过滤，使亮的颜色变得更亮，暗的颜色变得更暗。

saturate：通过组合源颜色的饱和度，目标颜色的色相和亮度产生的效果。saturate类似于hue，但是它使用可选择的属性。

color-dodge：提亮目标颜色来反映源颜色。