mask-clip
Summary
Determines the mask painting area, which defines the area that is affected by the mask. The painted content of an element may be restricted to this area.
Overview table
- Initial value
border-box
- Applies to
- All elements. In SVG, it applies to container elements without the <defs> element and all graphics elements.
- Inherited
- No
- Media
- visual
- Computed value
- As specified.
- Animatable
- No
- Percentages
- N/A
Syntax
mask-clip: border-box
mask-clip: content-box
mask-clip: no-clip
mask-clip: padding-box
Values
- no-clip
- The painted content is not restricted (not clipped). The mask painting area is set to the bounding client rect.
- border-box
- The painted content is restricted (clipped) to the border box (painting box for objects without associated layout box).
- padding-box
- The painted content is restricted (clipped) to the padding box.
- content-box
- The painted content is restricted (clipped) to the content box (object bounding box for objects without associated layout box).
Examples
/* border-box */
body {
background-color: white;
mask-image: url(big-black-dot.jpg);
mask-position: bottom right;
mask-repeat: no-repeat;
mask-clip: border-box;
}
Related specifications
- CSS Masking Level 1
- W3C Working Draft