在同一个精灵中水平和垂直重复图像 - 不可能吗?
我在手动创建高级 CSS 精灵方面经验丰富,但现在我发现自己想知道是否可以在同一个精灵中包含一张垂直重复背景的图像以及第二张水平重复(不同)背景的图像?
这在逻辑上似乎是不可能的,如果两个图像都必须真正重复,我的意思是想一想,您不能指定重复的裁剪区域,因此它们每个都会将图像扩展至垂直图形出现在水平背景和签证中的位置-反之亦然。
但我只是想确保我不会错过某种我不知道的技巧 - 感谢您提供任何建议或示例来探索。
如果您不确定我所描述的内容,请在纸上画一条水平线,然后在纸上的其他地方画一条高垂直线。现在想象一张图像在水平方向上重复,而另一张图像在垂直方向上重复。现在尝试想象一个精灵可以同时容纳图像和每个图像将使用的 CSS 规则。根据我所学到的知识,这是不可能的,但也许有一个我不知道的技巧。
I am experienced at creating advanced CSS sprites by hand, but I now find myself wondering if it's possible to have one image of vertically repeating background as well as a second image of horizontally repeating (different) background, contained in the same sprite?
It would seem logically impossible, if both images have to truly repeat, I mean think about it, you cannot specify a cropped area for the repeat, so they each would expand the image to where the vertical graphic would appear in the horizontal background and visa-versa.
But I just wanted to make sure I am not missing out on some kind of trick that I am not aware of - thanks for any suggestions or examples to explore.
If you are not certain what I am describing, draw a horizontal line across a paper and now draw a tall vertical line elsewhere on the paper. Now imagine one image repeating across the horizontal and a different image repeating down the vertical. Now try to imagine a sprite that could hold both images and the css rules each would use. It's not possible based on what I have learned but maybe there is a trick I don't know.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
简短的回答:不可能。 :)
在你的情况下我总是做的:
使用两个:
Short answer: not possible. :)
What I always do in your case:
Use two: