您的CSS规则存在问题:
您使用的缩写形式,其中
background-size-属性 在
background-position- 属性 之后 ,并且 必须用-
分隔
/。
您尝试做的是设置位置,但由于它
auto不是有效值,因此它将失败。
为了使其以简写形式工作,它必须看起来像这样:
background: url([URL]) 0 0 / auto 749px;
另请注意,有一个名为的值
cover,在这里可能更合适且更灵活:
background: url([URL]) 0 0 / cover;
的 支持 对于
background-size在速记符号也不算很广,因为它在Firefox 18 +,Chrome浏览器21+,IE9
+和Opera的支持。Safari完全不支持。关于此,我建议始终使用:
background: url("background1.png");background-size: auto 749px; 这里有一些示例和一个演示,以演示该行为。您会看到,例如Firefox会显示除第一个图像以外的所有图像。另一方面,Safari仅显示最后一个。
CSS
section { width: 200px; height: 100px; border: 1px solid grey;}#section1 { background: url(http://placehold.it/350x150) auto 100px;}#section2 { background: url(http://placehold.it/350x150) 0 0 / auto 100px;}#section3 { background: url(http://placehold.it/350x150) 0 0 / cover;}#section4 { background: url(http://placehold.it/350x150) 0 0; background-size: cover;}


