css中spr是什么意思

CSS中的spr是指CSS Sprites，即把多个小图片合并成一张大图片，然后在页面中使用background-position等属性来控制显示哪个小图片。这种技术可以有效地减少网页加载的http请求数，提高页面加载速度。

.sprite {
    background-image: url("sprite.png");
    background-repeat: no-repeat;
    display: inline-block;
}

.icon1 {
    width: 30px;
    height: 30px;
    background-position: 0 0;
}

.icon2 {
    width: 50px;
    height: 50px;
    background-position: -30px 0;
}

.icon3 {
    width: 20px;
    height: 20px;
    background-position: -80px 0;
}

.icon4 {
    width: 40px;
    height: 40px;
    background-position: -100px 0;
}

上面的代码中，.sprite类指定了背景图片，而.icon1、.icon2、.icon3、.icon4类分别指定了要显示的小图片在背景图片中的位置。这样，页面只需要加载一张背景图片，就可以显示多个小图片了。

除了使用背景图片来实现CSS Sprites，还有一种使用图像映射（Image Map）的方法。不过，由于图像映射需要用到<map>和<area>标签，而这种标签在响应式设计和移动端适配上会带来一些不便，所以使用背景图片实现CSS Sprites更为常见。