html里的hack:
<!--[if lte IE 9]>;小于等于 IE9版本
这是代码
<![endif]-->;结束
lte :less than(小于) or equal(等于);
css的hack:值的 hack,选择器的hack
IE6及以下的hack符号:_下划线和 - 减号,加在属性前面
IE6、7的hack符号:!叹号,加在属性前面
IE8的hack符号:\0/ 加在属性值后面
IE6、7、8、9、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 图片透明