【发布时间】：2012-05-05 05:05:32
【问题描述】：
我尝试使用background-clip: content-box 失败了。整个盒子都有一个背景，包括填充区域，而不仅仅是内容区域。
http://jsfiddle.net/alanhogan/7YjCV/6/
我做错了什么？
【问题讨论】：
标签： css
【发布时间】：2012-05-05 05:05:32
【问题描述】：
这是 CSS 中简写属性的常见问题。
因为background-clip is one of the properties that's set by the background shorthand property，您的background 样式隐式地将background-clip 设置为border-box（其初始值），覆盖您的显式background-clip 样式：
background-clip: content-box;
background: #ddd none /* border-box */;
如果您将background-clip 声明移到background 下方，它将按预期工作：
background: #ddd none;
background-clip: content-box;
【讨论】：
-
谢谢。疯狂的。我了解快捷方式属性及其工作原理，但鉴于
background快捷方式属性一直存在于forever，我几乎无法想象它被扩展/重新定义为现在包含没有的属性'甚至不曾存在！ -
@Alan H.：嗯，问题是，CSS 在 levels 中进行版本控制，其中添加了新功能，有时还会改进现有功能 - 所以当添加新属性时，仅将新版本的速记属性扩展为包含这些新属性是合适的。另请参阅：w3.org/TR/CSS/#css-levels 同样，一些 选择器（如
:not()）也将得到增强，以接受 CSS4 中更广泛的选择器。
background CSS 属性是一种定义所有背景属性的单行方式，包括background-clip。因此，指定background: #ddd 会取消您之前的@987654325@ 设置。相反，如果您将该行替换为 background-color: #ddd，它应该会按照您希望的方式工作。
Here's 对您的 jsfiddle 的小修改。
【讨论】：
-
非常感谢您的回答:)