如何优化浏览器、如何解决浏览器缓存以及如何解决浏览器兼容性问题

如下是工作中所总结出来的问题：

1、优化浏览器

      1）针对每个页面独有的样式建议分页面名称来写样式，因为所有的样式都写到一个样式文件中，那样页面会很大下载的时候就            会消耗时间。

      2）因为样式的渲染是从右往左的，所以在元素的选择器最好要具有该元素的特殊型，不至于选择器要一层一层的网上查找。

      3）针对相对路径和绝对路径的使用，如果网页和资源在同一服务器中，建议使用相对路径，否则使用绝对路径；

           原因：A、因为相对路径长度要比绝对路径的长度要端，所以阅读要容易的多，解析的时候要快捷写；

                     B、如果使用绝对路径的话，浏览器要要根据DNS去查找服务器的真实位置，然后在转移到该服务器并查找所请求的                             文件。但是相对路径的话，浏览器只在同一服务器中查找所请求的文件，这样就省去了浏览器要根据DNS查找服                               务器真实位置的工作，降低了浏览器的效率。

      4）设置字体样式时，如果设置多个字体样式（斜体、粗体、小型大写、字体大小、字体）等，建议使用字体的简写属性（font），因为如果每个样式单独来写的话，那么浏览器会多次去解析字体样式，所以简写会提高浏览器的性能。

      5）可以将图片整理为雪碧图、将JS/CSS文件进行压缩

2、浏览器缓存问题

      1）引用样式文件时在其文件名后加一个时间戳

      2）调用API时可以在url后面加一个版本号

3、浏览器兼容性问题

      1）png24格式的图片在IE6浏览器中透明度失效，解决方法：

方法1：可以使用png8格式，但是这种方法会导致其他浏览器中的图片失真，清晰度不高，而且图片边缘有瑕疵

方法2:使用DD_belatedPNG_0.0.8a-min.js该js来解决IE6不支持24png格式
css中的hack条件方式：
<!--[if IE 6]>
	<script type="text/javascript" src="js/DD_belatedPNG_0.0.8a-min.js"></script>
	<script type="text/javascript">DD_belatedPNG.fix("div,img,a,h1");</script>
<![endif]-->

      2）针对高度塌陷问题，IE6可以开启hasLayout属性，使用方法{zoom：1}；