Web前端学习—基础篇(29)_常见IE兼容问题

4.24、IE兼容问题

4.24.1、IE8中图片边框问题

• 解决方案：

img{ border: none; }

4.24.2、IE8中背景复合属性写法问题

• 现象：

background: url(images/esWe.jpg)no-repeat 0 0;

• 解决方案：

background: url(images/esWe.jpg) no-repeat 0 0;

4.24.3、鼠标指针形状为手型，兼容所有浏览器

• 解决方案：

设置属性  cursor: pointer;

• cursor属性：设置鼠标指针的形状
  cursor: text;/* 文本 /
  cursor: help;/ 帮助 /
  cursor: wait;/ 程序正忙，等待 /
  cursor: crosshair;/ 十字形 /
  cursor: pointer;/ 手型 /
  cursor: move;/ 移动 /
  cursor: auto;/ 默认，浏览器设置光标形状 /
  cursor: default;/ 默认光标 */

4.24.4、opacity属性 filter属性

4.24.5、IE6及更早版本浏览器中小高问题

• 解决

为盒子设置font-size:0; line-height:0;

4.24.6、IE6及更早版本浏览器中浮动产生的双边距Bug

• 解决

_display: inline;

4.24.7、IE6|7及更早版本浏览器中子元素相对定位，父元素设置overflow:hidden;失效问题

• 解决

在父元素上设置position: relative;

4.24.8、块元素转为行块元素在IE7及更早版本的浏览器中不在一行显示问题

• 解决

*display: inline; *zoom:1;

4.24.9、IE7及更早版本的浏览器中，当li中出现2个及以上的子元素浮动，li之间会有空白间隙

• 解决

为li标签设置vertical-align: top|bottom|middle;