该background-position属性用于指定背景图像或渐变的起始位置
.myClass {
background-image: url('path/to/image.jpg');
background-position: 50% 50%;
}使用X和Y坐标设置位置，并使用CSS内使用的任何单位设置位置。
| 单元 | 描述 |
|---|---|
| 值％值％ | 水平偏移的百分比相对于（背景定位区域的宽度-背景图像的宽度）。 垂直偏移的百分比相对于（背景定位区域的高度-背景图像的高度） 相对于图像的大小background-size。 |
| 值px值px | 相对于背景定位区域的左上角偏移背景图像的长度（以像素为单位） |
CSS中的单位可以通过不同的方法指定（请参见此处）。
除了上面的速记属性外，还可以使用速记背景属性background-position-x和background-position-y。这些使您可以分别控制x或y位置。
注意： Firefox（版本31-48）2以外的所有浏览器均支持此功能。将于2016年9月发布的Firefox 49将支持这些属性。在此之前，此Stack Overflow答案中包含Firefox hack。