高亮模式使用图像的 亮度 值作为遮罩值。如下图所示，遮罩层白色区域将显示出来，透明区域将会被隐藏：
最终得到的效果看上去相似：
Clipping
从上面的示例中，我们可以发现，剪切可以限制渲染区域，即所谓的剪切区域。从概念上讲：
剪切路径（不管是图形还是闭合的矢量路径）对某个元素进行剪切，将会分成两个区域， 路径内 （剪切区域内） 和 路径外 （剪切区域外）， 位于剪切区域内的部分可见（被绘制出来） 。
在Clipping中会用到
clip-path 、
clip-rule 和
<clipPath> ：
：用来绘制图形 clip-path
：用于确定给定点是否位于图形元素创建的剪贴区域的形状内的算法 clip-rule
：是SVG中的一个标签元素，可以被用于 <clipPath>
clip-path 的
url() 中，当作剪切路径源接下来了解这三个属性。
clip-path
clip-path 主要用来创建一个只有元素的部分区域可以显示的剪切区域， 区域内可见，区域外不可见 。其值主要有：
：未创建任何剪切区域 none
：CSS中绘制基本形状的函数，常见的函数有 <basic-shape>
inset() 、
circle() 、
ellipse() 、
polygon() 、
url() 和
path()
<geometry-box> ：如同
<basic-shape> 一起声明，它将为
<basic-shape> 提供相应的参考框盒子。通过自定义，它将利用确定的盒子边缘包括任何形状边角（比如说，被
border-radius 定义的剪切路径）
<geometry-box> 提供的框盒模式主要有：
