zoukankan      html  css  js  c++  java
  • ▲为什么要用css Sprite技术?


        一个网站,由许多元素构成,如:文本、图像、链接、表单、表格等,除了文本,图像当属重中之重了!在早先的

    网站设计中,图片都是独立分开的;到了2004年,Dave Shea(css禅意花园作者)提出了使用css控制组合图片的方案,将许

    多小的图片合成于一张画布里,再通过background-position进行定位,来控制图片的显示位置和方式。

        一时间,该方案得到人们的推崇,并将其称为css Sprite技术,中文意思大概就是“css贴图定位”或“css图像拼合”。

        那么,为什么要用该技术呢?它的优势在哪里?存在哪些缺点呢?

            首先,从网站的优化方面考虑。将许多图片拼合成一张图片,在加载时就不是对之前的每张图片进行加载了,而

    只要对拼合成的图片加载一次就够了,这就大大减少了http请求的次数,降低了服务器的负载;

            其次,从css的维护方面考虑。图片多了,就得为每张图片命名,命名并不是一件很轻松的事情,有时候可以把人

    搞得焦头烂额,而把众多的图片合成起来,只要为组合图片一次命名,省却许多的时间;另外,在样式表里书写代码时,可

    以将样式进行分离,只进行一次图片应用,而其他的都只是定位的问题了,提升了代码的精简。

        它的缺点同样要从css的维护方面来说,因为css sprite大多使用于较固定的像素定位中,而一用到定位,布局上

    就是固定住了,降低了网页的弹性。

        所以,在用该技术时,应该在可维护性和降低负载之间权衡利弊,选择适合项目的方式。

  • 相关阅读:
    iphone在iframe页面的宽度不受父页面影响,避免撑开页面
    touch事件应用
    js获取手机屏幕宽度、高度
    css3特效样式库
    js基础:对DOM进行操作,删除、添加元素
    eval基础,基础用法及解析json
    ajax调用数据案例,二级联动
    (原)String类两种实例化的区别
    java订电影票系统
    多线程练习(java)
  • 原文地址:https://www.cnblogs.com/balaixianren/p/2079327.html
Copyright © 2011-2022 走看看