-webkit-mask-attachment - CSS（层叠样式表） 编辑

非标准
该特性是非标准的，请尽量不要在生产环境中使用它！

如果使用了 -webkit-mask-image, -webkit-mask-attachment 将指定蒙版在视口的位置是固定的，还是同包含块一起滚动的。

/* 关键字 */
-webkit-mask-attachment: scroll;
-webkit-mask-attachment: fixed;
-webkit-mask-attachment: local;

/* 多个值 */
-webkit-mask-attachment: scroll, local;
-webkit-mask-attachment: fixed, local, scroll;

/* 全局值 */
-webkit-mask-attachment: inherit;
-webkit-mask-attachment: initial;
-webkit-mask-attachment: unset;

初始值	scroll
适用元素	all elements
是否是继承属性	否
适用媒体	visual
计算值	as specified
Animation type	discrete
正规顺序	order of appearance in the formal grammar of the values

语法

可用的值

scroll

使用 scroll 时, 蒙版在视口中同包含它的块一起滚动。

fixed

使用 fixed 时, 蒙版不会同包含它的元素一起滚动，而是在视口中固定不动。

使用语法

<attachment>#
where 
<attachment> = scroll | fixed | local

示例

body {
  -webkit-mask-image: url('images/mask.png');
  -webkit-mask-attachment: fixed;
}

浏览器兼容性

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

• Desktop
• Mobile

Feature	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
Basic support	(Yes) 未实现 24.0	未实现	未实现	未实现	4.0

Feature	Android	Firefox Mobile (Gecko)	IE Phone	Opera Mobile	Safari Mobile
Basic support	2.1	未实现	未实现	未实现	3.2

另见

-webkit-mask, -webkit-mask-clip, -webkit-mask-box-image, -webkit-mask-origin, -webkit-mask-image, -webkit-mask-composite, -webkit-mask-repeat