通过CSS选择背景图像，有什么区别？

Question

我正在玩一些CSS，到目前为止所有这些似乎都是这样做的：

background: url('/images/file.png');
background: image-url('file.png'); /* Doesn't requires as much info about the path. */
background-image: url('/images/file.png');

是否存在差异或仅仅取决于偏好？

Answer 1

您的第一个财产声明是简写：

background: #COLOR url('image.png');

这相当于：

background-color: #COLOR;
background-image: url('image.png');

通过省略颜色，您只需指定图像。

来自CSS2 spec：

的信息

  

'background'属性是用于设置各个背景属性的简写属性（即'background-color'，'background-image'，'background-repeat'，'background-attachment'和'background-position' ）在样式表的同一个地方。   第二个是无效的CSS。

第二个是CSS无效。不要使用它。

第三个是首选，因为它不会重置其他属性（也来自规范）：

  

给定一个有效的声明，'background'属性首先将所有单独的背景属性设置为其初始值，然后分配声明中给出的显式值。