使用CSS Sprites和repeat-x background-position处理透明像素

Question

我在问标题到底是怎么说的..。

#submenu-outer{
    height:40px;
    background: #F0EFE2 url(/template/img/main/intro12.png) 0px -240px repeat-x;
    width:100%;
}

这段代码没有任何意义；有什么建议吗？我想重复这一行的第一列。每隔一行( 40px)为空(0px -240px)

Answer 1

如果您使用repeat-x作为背景位置，它将重复整个图像文件的宽度。因此，如果你的精灵在40px之后有透明的像素，那么每隔40px左右你就会得到一些透明的背景，这实际上是正常的。

你可以让你的重复模式采用整个精灵的宽度，或者把它放在一个单独的文件中。