css - 如何指向图标集中的特定图标?

标签 css image icons css-sprites

这不是我第一次看到这种图像:

enter image description here

似乎每个图标都是使用 CSS 以编程方式指向的(???)。 它被称为图标集吗?在浏览网站时,我可以单独看到这些图标,但当我尝试保存它们时,它们显示为 base64 编码文件,并且所有单个图像都位于同一个 png 文件中。我的意思是,它是如何运作的?有没有办法将它们分开?它们如何在网站中使用?

谢谢!

最佳答案

它被称为“CSS Image Sprite”。

更多信息链接:

这是Web开发中非常常见的方法。很大程度上是因为它有助于限制 HTTP 请求。图像仅下载到用户缓存一次,然后移动以仅显示所需的部分。这比下载多个图像要高效得多。

关于css - 如何指向图标集中的特定图标?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27161806/

相关文章:

html - 异步图像加载jquery

css - 在主 div 内滚动 float div

html - CSS InfoBox 上面的所有元素如何放置?

图像和表格之间的 HTML/CSS 文本段落

javascript - 在图像的确切 "borders"上链接图像

html - 为什么我的 css 文件导入不起作用?

javascript - 更改动态生成的表格行背景颜色

html - 鉴于它是响应式的,我如何才能将我的文本置于图像之上?

ios - 应用程序图标未显示,尽管我已在 Xcode 5 中添加

android - 带搜索图标的键盘