/    /  CSS Clip

CSS Clip

 

The CSS clip property lets you specify a rectangle to clip an absolutely positioned element(position: absolute;). The rectangle is specified as four coordinates, all from the top and left corner of the element to be clipped.

 

Example:

 

<!DOCTYPE html> 
<html>
 <head>
  <style type = "text/css">
    div {
      background: url(good-morning.jpg);
      clip: rect(0px, 150px, 250px, 0px);
      border:3px solid red;
      height:200px;
      width: 250px;
      position: absolute;           
    }
  </style>
</head>

<body>
  <div></div>
 </body>
</html>

 

OUTPUT:

 

CSS Clip