CSS Property clip








Warning: This property is deprecated. Use clip-path instead.

The clip property sets a rectangle to clip an absolutely positioned element.

The rectangle is specified as four coordinates, from the top-left corner of the element to be clipped.

Summary

Initial value
auto
Inherited
no
CSS Version
CSS2
JavaScript syntax
object.style.clip="rect(0px,50px,50px,0px)"
Animatable
Yes

CSS Syntax

clip: auto|shape|initial|inherit;

Property Values

auto
Default. No clipping.
shape
Clips an element. The only valid value is: rect (top, right, bottom, left)
initial
sets to default value
inherit
Inherits this property from its parent element

Browser compatibility

clip Yes 8.0 Yes Yes Yes




Example

<!DOCTYPE html>
<html>
<head>
<style>
img {<!--from www  . j  ava2s.  c om-->
    position: absolute;
    clip: rect(0px,60px,200px,0px);
}
</style>
</head>
<body>

<img src="http://java2s.com/style/demo/border.png" width="100" height="140">

</body>
</html>

Click to view the demo