/

HTML / CSS / JavaScript Tutorial

CSS Property: clip

[this page | pdf | back links]

The CSS (CSS2) clip property indicates what to do with an image that is larger than its containing element. The clip property allows you to specify a rectangle to clip an absolutely positioned element. The rectangle is specified by four coordinates, all from the top-left corner of the element being clipped. The clip property does not work if the overflow property is set to visible.

 

Valid property values (other than inherit and initial) are:

 

Value

Description

auto

(default value). No clipping is applied

shape

Clips an element to within a given shape

 

Default Value:

auto

JavaScript syntax:

e.g. object.style.clip="rect(0px,10px,10px,5px)"

Inherited:

No

Animatable:

Yes

 

At the time of writing, the only valid type of value for shape was rect(top, right, bottom, left) where top, right, bottom and left are CSS lengths.

 


NAVIGATION LINKS
Contents | Prev | Next | CSS Properties


Desktop view | Switch to Mobile