background-clip和background-origin
background-clip和background-origin是两个CSS属性，用于控制元素背景图片的显示方式。
background-clip属性用于指定背景的裁剪区域，即背景图片的显示范围。默认情况下，背景图片会覆盖整个元素的内容区域，但如果设置了background-clip属性，可以将背景图片裁剪成不同的形状。background-clip属性可以接受以下值：
border-box（默认值）：背景图片显示在元素的整个盒子区域，包括内容区域、内边距区域和边框区域。padding-box：背景图片显示在元素的内容区域和内边距区域，不包括边框区域。content-box：背景图片只显示在元素的内容区域。
例如以下代码：
div {
background-image: url(bg.jpg);
background-clip: padding-box;
}
上面的代码将div元素的背景图片设置为bg.jpg，并将background-clip属性设置为padding-box，表示背景图片只显示在元素的内容区域和内边距区域，但是不包括边框区域。
background-origin属性用于指定背景图片的定位原点，即背景图片的起始位置。在默认情况下，背景图片的起始位置是元素的左上角，但如果设置了background-origin属性，可以将背景图片的起始位置改变到元素的内边距区域或者边框区域。background-origin属性可以接受以下值：
padding-box：背景图片的起始位置在元素的内边距区域。border-box：背景图片的起始位置在元素的边框区域。content-box（默认值）：背景图片的起始位置在元素的内容区域。
例如以下代码：
div {
background-image: url(bg.jpg);
background-origin: border-box;
}
上面的代码将div元素的背景图片设置为bg.jpg，并将background-origin的属性设置为border-box，表示背景图片的起始位置在元素的边框区域。
