ThinkChat🤖让你学习和工作更高效,注册即送10W Token,即刻开启你的AI之旅 广告
**background-origin** * 描述:设置或检索对象的背景图显示的原点 * 版本:CSS3 新增属性 * 继承性:无 **语法** ``` background-origin:背景图显示的原点 ``` 背景图显示的原点 * padding-box:从 padding 区域 (含 padding) 开始显示背景图像。 * border-box:从 border 区域 (含 border) 开始显示背景图像。 * content-box:从 content 区域开始显示背景图像。 **使用说明** 设置 background-position 属性显示背景图的起始原点。 如果背景图像的 background-attachment 属性为 fixed,则该属性没有效果。 **代码示例** 对背景图设置从内容分区域开始显示 ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>background-origin</title> <style> #container{ width: 400px; height: 400px; border: 1px solid #ff6600; background-image: url(../img/01.jpg); background-repeat: no-repeat; padding: 10px; background-origin: content-box; } </style> </head> <body> <div id="container"> </div> </body> </html> ``` ![background-origin](https://box.kancloud.cn/4c8d51209b585ca6030affbd64f7dc68_443x433.png)