Latest web development tutorials
 

Style clip Property

< Style Object

Example

Clip an image into a specified shape:

document.getElementById("myImg").style.clip = "rect(0px 75px 75px 0px)";
Try it Yourself »

Definition and Usage

The clip property sets or returns which part of a positioned element is visible.


Browser Support

Internet Explorer Firefox Opera Google Chrome Safari

The clip property is supported in all major browsers.


Syntax

Return the clip property:

object.style.clip

Set the clip property:

object.style.clip="auto|rect(top right bottom left)|initial|inherit"

Property Values

Value Description
auto Default. The element does not clip
rect(top right bottom left) Clips the shape defined by the four coordinates
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit

Technical Details

Default Value: auto
Return Value: A String, representing the part of a positioned element that is visible
CSS Version CSS2

More Examples

Example

Return the clip property:

alert(document.getElementById("myImg").style.clip);
Try it Yourself »

Related Pages

CSS tutorial: CSS Positioning

CSS reference: clip property


< Style Object