CSS3 background-clipProperty
Example
Specify the background of the plotting area:
div
{
background-color:yellow;
background-clip:content-box;
}
Try it Yourself »
Browser Support
The numbers in the table indicate the first browser version number that supports the property.
| Property | |||||
|---|---|---|---|---|---|
| background-clip | 4.0 | 9.0 | 4.0 | 3.0 | 10.5 |
Label definitions and usage instructions
The background-clip property specifies the background painting area.
| Default Value: | border-box |
|---|---|
| Inherited: | no |
| version: | CSS3 |
| JavaScript Syntax: | object object.style.backgroundClip="content-box" |
Syntax
background-clip: border-box | padding-box | content-box;
| Value | Description |
|---|---|
| border-box | Default value. The background is filled from the outer border (including the border) of the element. This is the default value of background-clip, meaning that the background image or color extends to the entire element area including the border area. |
| padding-box | The background only fills up to the padding area, that is, the background does not extend to the border area. The background image or color is clipped within the border, but does not include the border. |
| content-box | The background only fills up to the content area, that is, the background only appears within the content area, completely excluding the padding and border areas. The background is clipped within the content area. |
Related Articles
CSS3 Tutorial:CSS3 Backgrounds
other extensions