Html 雪碧没有正确定位

首先，我已经在这方面工作了很长时间：）主要是使用教程来尝试让它工作，疲惫不堪地寻找答案，但没有任何效果。我已经制作了一个带有链接的精灵，它工作正常，但它是垂直的，而不是我想要的水平的。任何帮助都将是惊人的

CSS

HTML

背景位置定义为
背景位置：[垂直偏移]，[水平偏移]。因此，只需反转偏移：

.hpa {width:150px; background-position:-2px -2px;display:inline;}
.co2 {width:150px; background-position:-2px -153px;display:inline;}
.cover {width:150px; background-position:-2px -304px;display:inline;}
.reg {width:150px; background-position:-2px -455px;display:inline;}
.asa {width:150px; background-position:-2px -606px;display:inline;}
.parts {width:150px; background-position:-2px -757px;display:inline;}

您可以使用查看您的
背景图像
和
css
。它将帮助您在
sprite
中正确地书写图像的
位置
，非常感谢您的帮助。更改周围的偏移后，精灵仍然垂直，仅显示精灵镜像的第一部分向下6处。
<a href="paintball-compressed-air-tanks.html"><img src="/transparent.gif" class="sprite images hpa" alt="Compressed Air Tanks" /></a>
<a href="co2-paintball-tanks.html"><img src="/transparent.gif" class="sprite images co2" alt="Co2 Tanks" /></a>
<a href="paintball-tank-covers-butts.html"><img src="/transparent.gif" class="sprite images cover" alt="Tank" /></a>
<a href="paintball-regulators.html"><img src="/transparent.gif" class="sprite images reg" alt="Paintball Regulators" /></a>
<a href="paintball-tank-accessories.html"><img src="/transparent.gif" class="sprite images asa" alt="Air Accessories" /></a>
<a href="paintball-air-service-parts.html"><img src="/transparent.gif" class="sprite images parts" alt="air system parts" /></a>

.hpa {width:150px; background-position:-2px -2px;display:inline;}
.co2 {width:150px; background-position:-2px -153px;display:inline;}
.cover {width:150px; background-position:-2px -304px;display:inline;}
.reg {width:150px; background-position:-2px -455px;display:inline;}
.asa {width:150px; background-position:-2px -606px;display:inline;}
.parts {width:150px; background-position:-2px -757px;display:inline;}