【问题标题】:Difference between IMAGE MAPS and CSS SPRITESIMAGE MAPS 和 CSS SPRITES 的区别
【发布时间】:2012-09-06 14:27:03
【问题描述】:

我找不到 IMAGE MAPS 和 CSS SPRITES 之间的明显区别。两者看起来都像是将页面中的图像合二为一?所以我们可以减少对服务器的多次请求。那么真正的区别是什么?

【问题讨论】:

    标签: css css-sprites imagemap


    【解决方案1】:

    图像映射:

    页面中的单个图像,您可以单击不同的区域,然后产生不同的效果(例如启动不同的链接)。

    这里有一个描述:http://www.javascriptkit.com/howto/imagemap.shtml

    CSS 精灵

    将多个 css 类背后的图像组合到一个文件中以提高性能 - 例如减少请求数量并通常减少整体下载大小。

    例如,您可以将颜色框对话框的各种边框元素组合成一个图像,或者将单击和未单击的图像组合成一个按钮。

    我发现的关于 CSS sprite 的最佳描述是:http://css-tricks.com/css-sprites/

    【讨论】:

      【解决方案2】:

      图像地图是一张图像,您可以将其转换为图像地图并在图像顶部放置多个链接。

      CSS sprite 是由多个图像组成的图像,您可以使用 CSS 背景定位来显示这种减少的 http 请求。

      【讨论】:

        【解决方案3】:

        图像地图是位于图像上的坐标的定义,以便能够对该区域上的事件做出反应。

        一个 css sprite 是两个或多个图像联合在一个图像中。

        【讨论】:

          【解决方案4】:

          我知道它是在一年前被问到的,让我试着用我自己的话来解释一下。

          CSS Sprite 就像一个单一的文件图像存储库,您可以通过 css 提取其中的任何部分并将它们单独放置在网页空间的任意区域中,而图像映射 (to-url) 顾名思义是具有映射到目标网址的可点击区域的图像。

          【讨论】: