CSS Reference Manual

CSS @rules (RULES)

Comprehensive List of CSS Properties

CSS background-color attribute CSS background-attachment attribute

CSS3 background-Usage and examples of the clip property

CSS background-The clip property specifies the background (color or image) of an element and whether it extends below its boundary.

The following table summarizes the usage context and version history of this attribute.

Default value:	border-box
Applies to:	all elements. It also applies to::first-letterand::first-line.
Inheritance:	None
Animatable:	No.Please see Animation attribute.
Version:	CSS3new feature
JavaScript syntax:	object　　　object.style.backgroundClip="content-box"

background-Syntax of clip usage

The syntax of this attribute is as follows:

background-clip: border-box | padding-box | content-box | initial | inherit

The following example demonstrates how to use background-clip attribute.

Example

.box {
　　　　width:　250px;
　　　　height:　150px;
　　　　padding:　10px;
　　　　border:　6px dashed #333;
　　　　background: orange;
　　　　background-clip: content-box;
}

Test to see‹/›

Attribute value

The following table describes the values of this attribute.

Value	Description
border-box	Specify that the background extends to the outer edge of the border. The background is drawn below the border. This is the default value.
padding-box	Specify that the background extends to the outer edge of the padding. The background is not drawn below the border.
content-box	Specify that the background is drawn only within the content box (clipped to). The background is not drawn below the border and padding area.
initial	Set this attribute to its default value.
inherit	If specified, the associated element adopts its parent element's background-The calculated value of clip attribute.

Browser compatibility

background-Browser compatibility of clip attribute, all mainstream browsers support this attribute.

	Firefox 4+ Google Chrome4+ Internet Explorer 9+ Apple Safari 3+ Opera 10.5+

Please refer to the following tutorials:CSS3Background,CSS3Background.