这篇翻译不完整。请帮忙从英语翻译这篇文章。
摘要
background-origin 规定了指定背景图片background-image 属性的原点位置的背景相对区域.
注意：当使用 background-attachment 为fixed时，该属性将被忽略不起作用。
假如
background简写中没有设置该值，那么在 background 简写值后指定background-origin，那么后面的值就会覆盖简写值，其实说白了，就是后出现的值会覆盖前面的值。| 初始值 | padding-box |
|---|---|
| 适用元素 | all elements. It also applies to ::first-letter and ::first-line. |
| 是否是继承属性 | 否 |
| 适用媒体 | visual |
| 计算值 | as specified |
| 是否适用于 CSS 动画 | 否 |
| 正规顺序 | the unique non-ambiguous order defined by the formal grammar |
语法
Formal syntax: <box>#
background-origin: border-box background-origin: padding-box background-origin: content-box background-origin: inherit
属性值
border-box- 背景将会延伸到延伸到外边界的边框，但是是在边框在上，背景在下，这个用border-style 为dashed可以直接看得出来。
padding-box- 背景描绘在padding盒子，边框里不会有背景出现。同样，背景将会延伸到最外边界的padding.
content-box- 背景描绘在内容区范围.
-
形式化语法
How to read CSS syntax.<box>#
例子
.example {
border: 10px double;
padding: 10px;
background: url('image.jpg');
background-position: center left;
/* 背景将在内容区padding内部填充 */
background-origin: content-box;
}
#example2 {
border: 4px solid black;
padding: 10px;
background: url('image.gif');
background-repeat: no-repeat;
background-origin: border-box;
}
div {
background-image: url('logo.jpg'), url('mainback.png');
background-position: top right, 0px 0px;
background-origin: content-box, padding-box;
}
规范
| Specification | Status | Comment |
|---|---|---|
| CSS Backgrounds and Borders Module Level 3 background-origin |
Candidate Recommendation |
浏览器兼容性
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Basic support | 1.0 [3] | 4.0 (2.0) [1] | 9.0 [2] | 10.5 | 3.0 (522) [3] |
content-box |
1.0 [3] | 4.0 (2.0) [1] | 9.0 [2] | 未实现 | 3.0 (522) [3] |
| Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | ? | ? | ? | ? | ? |
content-box |
? | ? | ? | ? | ? |
[1] Gecko supported, from version 1.1 to version 1.9.2, which corresponds to Firefox 1.0 to 3.6 included, a different, and prefixed, syntax: -moz-background-origin: padding | border.
[2] Internet Explorer up to version 7 behaves as if there was a background-origin: border-box; Internet Explorer 8 behaves as if it were background-origin: padding-box; which is the regular default value.
[3] Webkit also supports the prefixed version of this proprietary, and in that case, in addition to the current keywords, the alternative synonyms: padding, border, and content.
[4] Konqueror 3.5.4 supports -khtml-background-origin.