css之background-clip: text

说起 background-clip ，可能很多人都很陌生。Clip 的意思为修剪，那么从字面意思上理解，background-clip 的意思即是背景裁剪。

简单而言，background-clip 的作用就是设置元素的背景（背景图片或颜色）的填充规则。

与 box-sizing 的取值非常类似，通常而言，它有 3 个取值：

  background-clip: border-box;  // 背景延伸到边框外沿（但是在边框之下）

  background-clip: padding-box; // 边框下面没有背景，即背景延伸到内边距外沿。

  background-clip: content-box; // 背景裁剪到内容区 (content-box) 外沿。

-webkit-background-clip:text

使用了这个属性的意思是，以区块内的文字作为裁剪区域向外裁剪，文字的背景即为区块的背景，文字之外的区域都将被裁剪掉。

转载于:https://www.cnblogs.com/y-l-h/p/7389357.html