CSS定位精灵图（CSS Sprite）是一种在网页设计中经常使用的技术，它通过将多张图片合成为一张大图，并利用CSS的背景定位来实现图像的切换和滑动效果。这种技术可以减少网页的HTTP请求，从而加快页面加载速度，提高用户体验。
在使用CSS定位精灵图时，首先需要创建一张大图，将需要使用的小图按需合并到这张大图中。然后，通过CSS的background-image属性将这张大图作为背景，再使用background-position属性来定位需要的小图。
以下是一个示例代码，以一个包含两张小图的精灵图为例：

.sprite {
background-image: url('images/sprite.png');
width: 100px;
height: 100px;
}
<br>
.sprite-icon1 {
background-position: 0 0;
width: 50px;
height: 50px;
}
<br>
.sprite-icon2 {
background-position: -50px 0;
width: 50px;
height: 50px;
}

在上面的代码中，.sprite是一个包含两张小图的精灵图，它的宽度和高度分别为100px，通过background-image属性设置了背景图片。.sprite-icon1和.sprite-icon2是分别对应两张小图的类名，通过background-position属性分别将要使用的小图定位到正确的位置。
在HTML中，只需要给需要使用这些小图的元素添加对应的类名即可实现图像的显示。
例如：

<div class="sprite sprite-icon1"></div>
<div class="sprite sprite-icon2"></div>

如此一来，我们就成功使用了CSS定位精灵图来展示多个图像，同时还减小了HTTP请求的次数，优化了网页性能，提高了用户体验。
总之，CSS定位精灵图是一种非常实用的网页设计技术，它可以通过合并多张小图为一个大图来优化网页性能，并且可以简化HTML和CSS的编写过程，是一种非常值得使用的技术。