background

UK[ˈbækgraʊnd] US[ˈbækˌɡraʊnd]

n. (painting, etc.) background; background color; background information; soundtrack

Plural: backgrounds

clip

##英[klɪp] 美[klɪp]

n. Trim; (plastic or metal) clip; Paperclip; Clipping

vt.& vi. Pin on something with a pin, clamp on something with a clip

vt. Cut; cut off; shorten; shear...( or send)

vi. Trim; cut; cut out newspaper articles (or news, pictures, etc.); act quickly

Third person singular: clips Plural: clips Present participle: clipping Past Formula: clipped past participle: clipped clipt

css background-clip property syntax

How to use the background-clip attribute?

The background-clip attribute specifies the area where the background of the element is located. Syntax: background-clip: border-box|padding-box|content-box; among them, border-box (area within the border), padding-box (area within the padding area), content-box (area within the content area) .

Function: Specifies the drawing area of ​​the background.

Syntax: background-clip: border-box|padding-box|content-box;

Description: border-box The background is clipped to the border box. padding-box The background is clipped to the padding box. content-box The background is clipped to the content box.

Note: Internet Explorer 8 and earlier versions do not support the background-clip attribute.

css background-clip property example

<!DOCTYPE html>
<html>
<head>
<style> 
div
{
width:300px;
height:300px;
padding:50px;
background-color:yellow;
background-clip:content-box;
border:2px solid #92b901;
}
</style>
</head>
<body>

<div>
这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。
这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。
这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。
这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。
这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。
这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。这是文本。
</div>

</body>
</html>

Run instance »

Click the "Run instance" button to view the online instance