CSS Clip

The Clip property in CSS describes the element’s visible area. It applies over the elements which are absolutely positioned (position: absolute ;). Generally, it is used when an image is more significant than the existing element.

It permits us to portray a rectangle described as any four coordinates to clip the element, which is absolutely positioned.

Syntax:

Property values

auto: This property value is used as a default value, which displays the elements as they are. Using this value, no clipping will be defined.

Example:

Output:

CSS Clip

Shape: This property value is applied for clipping the elements. Any element’s defined area can be clipped using this value. Its authentic value is like this-rect(top, right, bottom, left);

Example:

Output:

CSS Clip

Pin It on Pinterest

Share This