一、无图片手艺界说
正在没有运用CSS 由CSS的引入的布景图片,没有囊括img标签内的图片况下生成相似图片成效的妙技换句话的意义就是正在运用纯CSS生成相似图片成效的技能。（http://www.yixiin.com/sitemap/index-htm-mid-5.html）
二、干什么要ldquo无图片rdquo?
率先咱们经过yslow的查新浪微博最新版首页的资料，失踪去 料细为206.8K, CSS Image年夜小为显然觉察CSS资料比CSS Image小良多。
万万纯粹拿这两个来比，还没有能注明什么。
上面咱们经过筹算来说下CSS资料与CSS Image联系
CSS Image是由一系列的图片组成，每一张图，即便最小一度小箭镞次图你存成一张图片，若何也得1KB吧。
相似微博的某个小三角形图形
假如咱们全副以CSS的体例模拟某个小箭镞，时刻资本会占若干好多?咱们来打算一下，率先贴下代码
HTML代码如次
CSS代码如次
从下面的代码能够看出，正在CSS资料中总共没有到200个字符，假如咱们遵照1字符等于1B的来打算的话，200个字符或者许等于0.2KB，比间接用图片做华侈了4/5的键入资源，显然缩小要求资源的大小。假如咱们尽能够的运用无图片技能来完成，显然能够前进页面的加载进度其次，咱们晓得每一度CSS image都需求一度http要求去加载，阅读器历次收回的要求个数是无限的，缩小CSS image的个数，较着缩小了http要求数，也就提高页面的呈现进度再次，时常运用微博的同窗都晓得，微博是能够换肤，假如运用CSS无图片技能，咱们仅需求轻易换一下CSS属性就能完成换肤，进步了代码的可呵护性。
经过之上综合，运用CSS无图片技能，能够小结失以次3个利益
缩小要求资源的大小
缩小http的要求个数
进步可护卫性
三、CSS无图片技能，微博中有哪些实践使用呢?
经过下面的揭示，咱们能够看到，无图片技能，正在微博上使用差错常普遍的。
四、无图片技能的完成形式
或者许有四种形式：一是经过成图片二是经过字符生成图片三是经过CSS3 的生成图片个要思忖初级阅读器没有兼容的成就是CSS3的自界平话体成图片。
采用CSS的功能够生成一些图形，相似三角形。地道的C**的形式，彻底能够兼容。
成的小方块，成效如次：
CSS代码：
成的小方块，成效如次：
CSS代码：
成的小三角形，成效如次：
CSS代码：
成的尖三角形，成效如次：
CSS代码：
成的斜三角形，成效如次：
HTML机关：
CSS代码：
经过之上5种图形，能够失去以次图形，成效图如次。
那儿那里只贴一下两头图形的代码，其余的，要兴味的同窗能够本人去钻研，更多成心思的图形等着你去实现。
HTML组织：
CSS代码：
2.经过字符生成图片，相似尖角、圆点以及箭镞，这也是C**规模，彻底能够兼容ie6。某个正在博中运用宽泛，那里没有配合写demo了。
角，成效图如次
HTML构造：
CSS代码：
点，成效图如次
HTML构造：
CSS花式：
镞，成效图如次
HTML构造：
CSS技俩：
微博名人堂没做具体的界说，然而提议能够对于书体名目做些制约，再不正在各族阅读器浮现一样。
成图片，运用变等CSS3的新属性生成图形，IE阅读器下突变**的运用需求运用IE的突变滤镜，然而运用滤镜资源会破耗很大，因为，依据名目实践状况去权衡能否运用滤镜。
先看下谷歌搜寻旋钮的事例
CSS式子：
寻某个旋钮没有运用滤镜，IE阅读器就没有做突变解决，自己都晓得无比正在意功能的公司，有些时分为了极了的功能，略微牺牲一下听觉经验也是能够承受的。
再看一下上网ldquo搜检更多rdquo的旋钮
CSS款式：
淘宝网某个旋钮运用滤镜，能够圆满兼容IE，千万这也没有能去猜想淘宝没有正视功能，只能说听觉经验和功能博弈的后果。
4. CSS3的自界说书体成图片，当然某个法子没有归于真正意思的无图片，然而简单编者和回护，更首要的是它的分寸，色彩能够经过CSS来把握，这直接地做到少运用图片。
详细使用，微博微吧的ICON
HTML构造：
CSS款式：
至于详细完成形式的实践根底，要开展写，又是一篇作品，有兴味的同窗参考一下神飞写的《CSS3 icon font彻底指南》
总之，CSS无图片技能，是咱们正在写CSS款式中需求构成的一种理念，我无须死磕无图片技能，要正在实践的名目衡量短长，依据实践状况，活络使用无图片技能做一些正当无效的功能优化。
