浏览器兼容、图片格式

html里的hack：

<!--[if lte IE 9]>;小于等于 IE9版本

　　这是代码

<![endif]-->;结束

lte :less than(小于) or equal（等于）;

css的hack：值的 hack，选择器的hack

　　IE6及如下的hack符号：_下划线和 - 减号，加在属性前面

　　IE六、7的hack符号：！叹号，加在属性前面

　　IE8的hack符号：\0/  加在属性值后面

　　IE六、七、八、九、10hack符号：\9  加在属性值后面

选择器的hack：

　　IE6 及如下版本的hack符号：* html   加在选择器前面   (* html  .box)

　　IE7及如下版本的hack符号：,  加在选择器后面（.box,）

　　除了IE6的hack符号：html>body   加在选择器前面，（html>body  .box）

IE6 盒模型：

　　字号的像素不能大于 盒子的高度　　解决方法：字号的像素变小

浮动的浏览器兼容：

　　高级浏览器：不浮动的元素会到浮动元素下面

　　IE6：在浮动元素后面的不会出现压盖效果　　　　解决方法：不要用浮动制做压盖，同级元素，一个浮动另外一个也要浮动

　　IE6 像素 bug：

　　　　若是元素一个浮动，一个不浮动，IE 6 里会并排排列，同时两个元素之间多了 3 像素间距 　　

　　　　解决方法：1.同级元素全都浮动

　　　　　　　　　2.给浮动的元素添加一个  margin-right   值为负数

　　IE6 图片边框问题：

　　　　图片外包裹了一个 a 标签，在 IE6 里会比正常状况给图片多加了一个蓝三色的边框

　　　　解决方法：给 img  都清除边框 （border：none）

 　　双倍 margin 问题

　　　　若是浮动的方向和 margin 边距的方向相同，那么首个浮动的元素，距离父盒子的边距

　　　　是 margin 值的两倍。

　　　　　解决方法：1.浮动的方向与 margin 的方向相反，父盒子和第一个元素的间距用父盒子的 padding挤出来

　　图片格式：

　　　　JPG图片点：能够压缩，品质能够调整，缺点：不能保存图层、背景透明、图片半透明的效果

　　　　　　用途：有实际意义的结构，用做插入图，背景不是透明的背景图，图片比较小

　　　　PNG图片：特色：能够保存图层，缺点：文件太大

　　　　　　若是保存的图片背景透明，文件色彩，形状都比较简单，png图片处处成没有图层的时候，文件反而比JPG要小

　　　　　　用途：背景透明和半透明的图片，精灵图，图片比较小，色彩不是很复杂

　　　　GIF：特色：色彩单一，品质不能调，文件比较小，能保存图层，支持透明，不支持半透明，能作动图

　　　　　　用途：动图，，解决IE6 图片透明