css - 从png精灵中仅重复1px作为div的背景

时间:2011-04-16 11:37:31

标签: css

在搜索类似的东西之后,我可以找到任何真实的答案。

问题很简单,我有一个sprite png图像,我用于网站中的所有图像资源。 我有一个bg.png文件,它是1px xpx半透明文件。 在需要的地方,我把div作为背景。

我想摆脱那个1px文件。

任何想法如何做到这一点?重复图像的1x1像素部分作为重复背景?

编辑:我确实想要一个解决方案:

使用c#代码我可以操作我需要的图像部分,创建一个新的并将其作为内存流返回。 但我只是想知道这是否可以通过纯粹的CSS。

2 个答案:

答案 0 :(得分:0)

不幸的是,这是不可能的。通常,使用单独的背景精灵。我建议在这里阅读:http://www.phpied.com/background-repeat-and-css-sprites/

此外,来自http://www.telerik.com/help/aspnet-ajax/grid-appearance-css-sprites.html

As a consequence:

a) images that repeat in both directions cannot be included in a sprite, they should remain on their own
b) images that repeat horizontally should occupy the entire width of a CSS sprite (as in the example above)
c) images that repeat vertically should occupy the entire height of a CSS sprite

答案 1 :(得分:-1)

你会考虑一个相当脏的骗子解决方案吗?当我遇到这个问题时,我从图像的宽度偷了一个像素,在那个1px宽的像素列中我放了我想要的东西。也就是说,我将你的bg.png复制到该像素列中。

这样,我可以完全摆脱bg.png。当然,我必须以相同的方式修改每个img,但如果img来自精灵,那么(对我来说)是值得的。

http://www.pwilson.net/so-wide-cheat.jpg已被http://www.pwilson.net/so-narrow-cheat.jpg

取代