美文网首页
Image Sprite

Image Sprite

作者: 一无是个好孩子 | 来源:发表于2016-09-19 18:21 被阅读0次

    目的

    为了提高网站整体性能,针对我们网站图片比较多,我们决定采用 image sprite 方案减少 http 请求以优化性能;

    规则

    使用此方案有两个必须遵循的规则:

    1. 图片必须是两倍图一倍使用
      两倍图在切图时完成;使用时,按照一倍使用;例如:图片大小是44*44,我们使用的时候包裹图片的容器应该是22*22。
    2. 必须为 png 图片,以 iconP 开头,即 iconP*.png
      例如:iconP-avatar.png;

    建议

    1. 建议只合并复用的图片(在多个页面出现);
    2. 建议只针对尺寸比较小的 icon(<100*100);
    3. 图片大小以不超过 2k 为宜;

    未完待续。。。

    相关文章

      网友评论

          本文标题:Image Sprite

          本文链接:https://www.haomeiwen.com/subject/vesnettx.html