CSS mask-clip property

Description

CSS mask-clip property specifies the area affected by the mask.

mask-clip : border-box | padding-box | content-box

border-boxDefault: In this case, the mask of all of the areas within border-box is painted such as content area, padding area, and border area.; mask-clip: border-box;
Try it
padding-box: In this case, the mask of the areas that are within padding-box are painted such as the padding and content areas.; mask-clip: padding-box;
Try it
content-box: Only mask of content-area is painted i.e. excluding the other two areas.; mask-clip: content-box;
Try it

It applies to all elements

Code

CSS

.element{
width:70%;
height:100px;
background:green;
border:10px solid red;
padding:10px;
-webkit-mask-image:url(img/web4college.png);
}

HTML

<div class="element">
  CSS mask-clip property specifies the area affected by the mask
 </div>