实测图片的http请求

请在主流浏览器中打开测试页面，在fiddler里查看http请求.
1. 隐藏图片
6 H, q+ m, a% q6 }& h9 X- z<img src=1.jpg style=display: none />测试：test_1.html
" }7 ^/ G7 R+ `* O结论：只有opera不产生请求.
" T" ~( U% G0 Z" E' c2 b, g+ L注意：用visibility: hidden隐藏图片时，在opera下也会产生请求.
8 c$ C. k+ z& Y7 y2. 重复图片
' }1 a4 m; g- e<img src=1.jpg /><img src=1.jpg />测试：test_2.html
结论：所有浏览器都只产生一次请求 .
0 }5 b2 G4 D4 z3. 重复背景
<style type=text/css> .test1 { background: url(1.jpg) } .test2 { background: url(1.jpg) }</style><div class=test1>test1</div><div class=test2>test2</div>测试：test_3.html
  w0 Q2 }4 j+ G3 D% r& z9 {; o4 m$ r结论：所有浏览器都只产生一次请求.
4. 不存在地元素地背景
  t0 Q$ K& q- W* i. k0 h7 P; o<style type=text/css> .test1 { background: url(1.jpg) } .test2 { background: url(2.jpg) } /* 页面中没有class为test2地元素 */</style><div class=test1>test1</div>测试：test_4.html
' m% o# U7 I2 E* f  u结论：背景仅在应用地元素在页面中存在时，才会产生请求.这对css框架来说，很有意义.
( ?! N4 }9 T% b2 p5. 隐藏元素地背景
7 `, I. ^; u8 r3 U4 q<style type=text/css> .test1 { background: url(1.jpg); display: none; } .test2 { background: url(2.jpg); visibility: hidden; }</style><div class=test1>test1</div>测试：test_5.html
结论：opera和firefox对于用display: none隐藏地元素背景，不会产生http请求.仅当这些元素非display: none时，才会请求背景图片.
6. 多重背景
9 C- z# z! l3 V, e7 a<style type=text/css> .test1 { background: url(1.jpg); } .test1 { background: url(2.jpg); }</style><div class=test1>test1</div>测试：test_6.html
% r2 R% t" K6 r; |; P- F结论：除了基于webkit渲染引擎地safari和chrome，其它浏览器只会请求一张背景图.
" r) E) e! O0 v% O注意：webkit引擎浏览器对背景图都请求，是因为支持css3中地多背景图.
0 v! \( c2 B3 S1 G7. hover地背景加载
6 w; W4 `6 \( ]<style type=text/css> a.test1 { background: url(1.jpg); } a.test1:hover { background: url(2.jpg); }</style><a href=# class=test1>test1</a>测试：test_7.html
结论：触发hover时，才会请求hover状态下地背景.这会造成闪烁，因此经常放在同一张背景图里通过翻转来实现.
注意：在图片no-cache地情况下，ie每次hover状态改变时，都会产生一次新请求.很糟糕.
4 D' A5 I+ X& a2009-05-13晚补充：上面地解释有误，更详细地解释请参考续篇.翻转技巧指地是sprite技术，例子：test_7b.html, 在ie6下不会产生闪烁.
8. js里innerhtml中地图片
" I9 |% a0 D( |<script type=text/javascript> var el = document.createelement('div'); el.innerhtml = '<img src=1.jpg />'; //document.body.appendchild(el);</script>测试：test_8.html
: {0 R. ~% T6 M4 o. e结论：只有opera不会马上请求图片.
注意：当添加到dom树上时，opera才会发送请求.
* l0 [; ?" k3 e0 M
更多网页制作信息请查看： 网页制作

卧虎藏龙里面半天云的人物个性。由此而言，作者是性格是完善的，想必经历过家庭的其 乐融融，也经历过种种人伦惨剧吧，把作者的创作潜质激发的淋漓尽致。

看到本ID的这位童鞋,我看你气度不凡,谈吐间隐隐有王者之气,日后必有一番作为! 内有“加关注”三字,你就顺手把它点了吧。相得准,我分文不收;相不准,你也好回来找我。

想骂你.却不知道从何骂起.

呵呵　　我傻了‘～～哈哈

明天我给发过来

楼主，你要继续努力啊！你是bbs的希望啊！你是网络文学的希望啊！你是整个网络界的希望文学界的希望啊！你是整个人类的希望啊！你是整个太阳系的希望啊！你是整个异次元空间的希望啊！

既然你诚心诚意地发贴了，那我就大发慈悲地回复你。为了防止此贴被秒沉，为了维护此楼的繁荣！贯彻爱与真实的邪恶，可爱又迷人的顶贴角色！ 穿梭在贴吧之间的顶贴队！喵～就是这样

这篇帖子构思新颖，题材独具匠心，段落清晰，情节诡异，跌宕起伏，主线分明，引人入胜，平淡中显示出不凡的文学功底，可谓是字字珠玑，句句经典，是我辈应当学习之典范（不好意思回错帖了

我不是来为楼主呐喊加油的，也不是对楼主进行围堵攻击的。

这日子没法过了....