Html 使用多个背景的CSS精灵表

我正在使用CSS Sprite表单技术，但在多个背景中遇到问题

在这个网站上-你可以看到如何设置背景从一个精灵表，但我的情况是有点不同

简单代码：

#导航1{
背景：url(https://n3olukas.000webhostapp.com/images/nav-icons.png)-165px-19px无重复，url(https://n3olukas.000webhostapp.com/images/x3_1.png)不重复；
宽度：自动；
高度：40px；
背景尺寸：319px 349px，自动；
}

---

您必须指定宽度

#导航1{
背景：url(https://n3olukas.000webhostapp.com/images/nav-icons.png)-165px-19px无重复；
宽度：40px；
高度：40px；
背景尺寸：319px 349px，自动；
位置：相对位置；
}
#导航1：之后{
内容：“；
背景：url(https://n3olukas.000webhostapp.com/images/x3_1.png)不重复；
宽度：232px；
高度：40px；
位置：绝对位置；
z指数：-1；
}

---

您必须指定宽度

#导航1{
背景：url(https://n3olukas.000webhostapp.com/images/nav-icons.png)-165px-19px无重复；
宽度：40px；
高度：40px；
背景尺寸：319px 349px，自动；
位置：相对位置；
}
#导航1：之后{
内容：“；
背景：url(https://n3olukas.000webhostapp.com/images/x3_1.png)不重复；
宽度：232px；
高度：40px；
位置：绝对位置；
z指数：-1；
}

---

不可能在多个背景设置中分别裁剪每个图像。因此，如果希望保留黄色条，但只显示其上的一个图标，请考虑使用伪元素，或者保留显示单个图标的实际DOM元素。E、 g.此处带有

：

#导航1{
背景：url(https://n3olukas.000webhostapp.com/images/x3_1.png)不重复；
背景尺寸：自动；
高度：40px；
宽度：自动；
}
i、 icon1{
背景：url(https://n3olukas.000webhostapp.com/images/nav-icons.png)-165px-19px无重复；
背景尺寸：319px 349px；
显示：内联块；
高度：40px；
宽度：40px；
}

---

不可能在多个背景设置中分别裁剪每个图像。因此，如果希望保留黄色条，但只显示其上的一个图标，请考虑使用伪元素，或者保留显示单个图标的实际DOM元素。例如，此处带有

：

#导航1{
背景：url(https://n3olukas.000webhostapp.com/images/x3_1.png)不重复；
背景尺寸：自动；
高度：40px；
宽度：自动；
}
i、 icon1{
背景：url(https://n3olukas.000webhostapp.com/images/nav-icons.png)-165px-19px无重复；
背景尺寸：319px 349px；
显示：内联块；
高度：40px；
宽度：40px；
}

---

您想如何显示它？剪短了？我想是的。我想删除这两个图标，只显示第一个。此效果类似于高度或宽度，但我不能在多个背景中使用它：/n您想如何显示它？剪短了？我想是的。我想删除这两个图标，只显示第一个。这个效果就像高度或宽度一样，但我不能在多重背景中使用它：/it crops yellow bar。it crops yellow bar。回答不错，谢谢。我有一个问题：为什么你用

而不是

。它更好吗？@LukasNaujokaitis不，没有真正的理由，除了Font Awesome设定的“惯例”。他们之所以使用AFAIK，是因为它只有一个字符长，你可以说它代表“图标”。但是

元素表示“斜体”。“没事吧？”卢卡斯·诺约加提斯，如果你把它空着，没人会知道：）呵呵，谢谢。总之，我找到了一篇关于这件事的好文章：。似乎使用

是一种不好的做法，但有些人使用它是因为你所说的原因。回答很好，谢谢。我有一个问题：为什么你用

而不是

。它更好吗？@LukasNaujokaitis不，没有真正的理由，除了Font Awesome设定的“惯例”。他们之所以使用AFAIK，是因为它只有一个字符长，你可以说它代表“图标”。但是

元素表示“斜体”。行吗？@LukasNaujokaitis如果你让它空着，没人会知道：）呵呵，谢谢。总之，我找到了一篇关于这件事的好文章：。似乎使用

是一种不好的做法，但有些人使用它是因为你所说的原因。