css绑定背景大小？

Question

有人可以请向我解释这个属性是怎么回事。它的CSS背景img缩放到视网膜像素显示密度的一半大小。

background: url('../img/kellin-retina.png') no-repeat scroll 0px 0px /200px 70px; 

什么了以前/200像素70像素的0像素0像素一部分。如果我把它拿出来，背景不会缩小。这两个像素大小绑定到什么地方？

由于

Answer 1

第一组0px 0px定义的背景图像（左上），第二组200px 70px限定的尺寸，在此缩写符号它代表background-size的位置。

如果在第二组中只有一个值，则它将是图像的宽度。到刚才设置的高度，你可以这样做：

background: url('../img/kellin-retina.png') no-repeat scroll 0px 0px /auto 70px; 

背景届时将达到70像素高和宽度将相应地。看到一个demo，其中背景图像将永远是视口的一半。

Answer 2

要确保你说明什么的，可以考虑包括这样所有的属性：

background-image: url('../img/kellin-retina.png'); 
background-repeat: no-repeat; 
background-attachment: scroll; 
background-position: 0px 0px; 
background-size: 200px 70px; 

这是你的代码分解到这是什么意思。我不完全是你的问题，但尝试打开你的浏览器的开发工具来取消选中并检查属性，看看它对你的页面有什么影响，并修改数字，以更好地理解你在做什么。如果您在制作某些特定工作时需要帮助，如果您制作代码的Fiddle或向我展示实时网站，我可以提供帮助。