如何仅将我的精灵图像的一部分重复作为div的背景

用户名

我只需要将精灵图像的一部分作为div背景,但是结果是这样的:

在此处输入图片说明

我假装是这样的:

在此处输入图片说明

我需要在模板中仅使用一个精灵图片(老板要求)。为此,我需要帮助。

我的html:

<div class="background"></div>

我的CSS:

.background {width: 100%; 
             height: 166px; 
             background-size: 93px 166px; 
             background: url('library/images/sprites.png') -150px 0px repeat-x; 
            }
秩序与混乱

您只能在一个方向上重复精灵。

要水平重复精灵,您需要编辑精灵,以使要重复的图像位于其他图像的下面,而在图像的两边都没有其他内容。

然后,您提供的代码将起作用(更改位置以适合)。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何在div的背景上使用精灵,定位到div右侧的精灵的一部分

如何将背景色仅作为选择的一部分?的CSS

如何仅显示图像的一部分

如何仅分析图像的一部分?

如何在画布中提取图像的一部分并将其用作div的背景图像?

grep仅重复日志的一部分

捕获我的画布下的图像作为图像的一部分

如何将我的/ boot分区合并为/分区的一部分?

如何将我的Javascript变量打印为HTML属性的一部分?

如何遍历javascript数组并仅显示数组的一部分然后重复

如何仅绘制视图背景的一部分

如何仅映射图像源属性的一部分

Fabric.js:如何仅显示图像的一部分?

如何使用OTSU阈值取阈值仅图像的一部分?

如何仅将亮度效果应用于图像的一部分?

如何在Flask中返回图像作为GET请求响应的一部分?

如何仅解析JSON的一部分?

如何仅编码URL的一部分

如何仅更改状态的一部分?

如何仅渲染Sprite的一部分

如何仅加粗段落的一部分?

如何显示大图像的一部分?

如何淡化图像的一部分

如何减少我的代码的这一部分,使其不重复

如何执行多个查询以仅返回我的数据的一部分

如何仅验证我通过获取请求获得的值的一部分?

我如何迭代从Mongodb返回的arrayList作为结果的一部分?

我如何创建自己的完成处理程序作为方法参数的一部分

作为我提交给Slurm的一部分,如何激活特定的Python环境?