html - css 绑定(bind)中的背景大小？

Question

有人可以向我解释一下这个属性是怎么回事吗？它是一个 css 背景图片，比例缩小到视网膜像素显示密度的一半。

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

/200px 70px 之前的0px 0px 部分是怎么回事。如果我把它拿出来，背景不会缩小。这两个像素大小绑定(bind)到什么？

谢谢

Answer 1

第一组 0px 0px 定义背景图像的位置(左上角)，第二组 200px 70px 定义尺寸，在这个简写符号中它代表 background-size .

如果第二组中只有一个值，它将是图像的宽度。要仅设置高度，您可以执行以下操作:

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

背景将变为 70 像素高，宽度将相应缩放。查看demo ，其中背景图片的高度始终是视口(viewport)的一半。