+ -
当前位置:首页 → 问答吧 → background image是否增加HTTP连接数?

background image是否增加HTTP连接数?

时间:2011-09-20

来源:互联网



如上图,及下面的代码,如果一个表格,中间一个TD的宽度和高度随意变动。周围8个TD使用8张不同的背景图。这样使用背景图,是不是增加很多的HTTP连接数?有没有办法把所有的背景图画在一个PNG上?


HTML code

<style >
#fancybox-bg-n { background:url('fancybox/fancy_shadow_n.png') repeat-x; }
#fancybox-bg-ne { background:url('fancybox/fancy_shadow_ne.png'); }
#fancybox-bg-e { background:url('fancybox/fancy_shadow_e.png') repeat-y; }
#fancybox-bg-se { background:url('fancybox/fancy_shadow_se.png'); }
#fancybox-bg-s { background:url('fancybox/fancy_shadow_s.png') repeat-x; }
#fancybox-bg-sw { background:url('fancybox/fancy_shadow_sw.png'); }
#fancybox-bg-w { background:url('fancybox/fancy_shadow_w.png') repeat-y; }
#fancybox-bg-nw { background:url('fancybox/fancy_shadow_nw.png'); }
</style>

<table border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td id="fancybox-bg-nw">&nbsp;</td>
    <td id="fancybox-bg-n">&nbsp;</td>
    <td id="fancybox-bg-ne">&nbsp;</td>
  </tr>
  <tr>
    <td id="fancybox-bg-w">&nbsp;</td>
    <td style="width:100px;height:100px;display:block;background:#306">&nbsp;</td><!-- 这里的宽和高随意变动 -->
    <td id="fancybox-bg-e">&nbsp;</td>
  </tr>
  <tr>
    <td id="fancybox-bg-sw">&nbsp;</td>
    <td id="fancybox-bg-s">&nbsp;</td>
    <td id="fancybox-bg-se">&nbsp;</td>
  </tr>
</table>

作者: changjay   发布时间: 2011-09-20

把小图合并到一起 就是 传说当中的 css sprites

作者: calmcrime   发布时间: 2011-09-20

热门下载

更多