IE6常见CSS解析Bug和hack

第一：图片间隙

　　a:div中的图片间隙；

　　　描述：在div中插入图片时，图片会将div下方撑大3像素

　　　　hack1：将<div>和<img>写在一行

　　　　hack2：将<img>转为块元素，给<img>添加声明：display:block;

　　　　hack3：给<div>设置：overflow:hidden

　　b:dt，li中图片间隙

　　　　hack：同a中的hack2，hack3方法

第二：默认高度

　描述：在IE6及以下版本中，部分块元素具有默认高度（低于18px高度）

　　hack1：给元素添加声明：font-size:0;

　　hack2：给元素添加声明：overflow:hidden;

第三：双倍浮动（双倍边距）

　描述：当IE6及更低版本浏览器在解析浮动元素时，会错误的把浮向边边界加倍显示

　　hack：给浮动元素添加声明：display:inline;

第四：表单元素行高不一致（几乎没个浏览器都有）

　描述：表单元素行高对齐方式不一致

　　hack：给表单元素添加声明：float:left;

第五：按钮元素默认大小不一

　描述：个浏览器中按钮元素大小不一致

　　hack1：统一大小（用其他标签模拟按钮）

　　hack2：input外边套一个标签，在这个标签上边写按钮的样式，把input标签的边框和背景样式去掉

　　hack3：将按钮样式的图片直接设置为背景图片

第六：百分比Bug

　描述：IE浏览器在解析百分比时，会按四舍五入的方式计算从而导致50%+50%>100%的情况

　　hack：给右面的浮动元素添加声明：clear:right;或者clear:left;或者clear:both;

第七：鼠标指针Bug

　描述：cursor属性的hand属性值只在IE6及以下版本浏览器识别，其他浏览器不识别该声明，cursor的pointer属性值IE6以上版本及其他浏览器都识别

　　hack：统一鼠标手型形状应将cursor:hand;加上，默认的为cursor:pointer;

第八：透明属性

　　hack：IE浏览器（8以下）：filter:alpha(opacity=value);（取值范围1到100），其他浏览器写法：opacity:value;（value的取值范围0.1到1）

第九：过滤器

　　1：下划线过滤器

　　　描述：在一个属性前加了下划线后，在IE6及以下版本能识别这个规则，别的浏览器则不识别而忽略这个属性

　　2：important关键字过滤器

　　　描述：表示所附加的声明具有最高优先级的意思，IE6及以下版本不识别

转载于:https://www.cnblogs.com/shenhf/p/7567968.html