IE浏览器一些兼容问题

主要是在IE7以下的浏览器显示会出现问题。IE7以下浏览器显示的内容应该是和其他的浏览器显示的内容一样的，那么我们就得做一件事：fuck IE,浏览器兼容，通过写其他的一些代码进行一个IE7以下的浏览器的兼容，css hack;

IETester:IE各版本的测试软件

行内元素，块元素，行内块元素都是基于标准流

IE6,IE5,会出现的问题

1.双边距:

出现连续浮动，并且浮动方向和设置外边距的方向是一致的，那么第一个浮动的元素距离浮动方向的外边距则表现为双倍

处理方式：

将浮动的元素display:inline

2.最小高度问题

给标签元素设置边框线，不设置高度，在IE6里面显示出高度，该高度其实指的是字体的大小

处理方式：将font-size设置为0，将line-height也设置为0

3.子级撑开父级

元素子级元素比父级元素要大

处理方式：

给父级元素设置overflow:hidden

4.子元素不支持负边距

子级元素在IE6中设置负边距无效果

处理方式：

给子级元素设置position:relative

5.IE5不支持margin:0 auto;

解决方式:

设置定位为50%，再使用负边距，负边距的值为宽高的一半

6.行内元素与行内块元素共处一行，line-height属性是不起作用的。

处理方式：

给行内块元素设置margin-top:（父盒子的高度-子盒子的高度）/2

7.li元素间出现空隙

当li不浮动，子元素浮动的时候，会在每个li中间出现缝隙（3像素）

处理方式：

将li设置vertical-align:top

8. 3像素问题当有盒子浮动，另外一个盒子不浮动的时候，在IE6中是不会说覆盖标准流元素的，并且两个盒子中间还会出现3px的间隙

解决方式：

1.将两个盒子都设置为浮动

2.将浮动的盒子设置margin-right:-3px;

9.两个浮动元素之间，写注释出现多余字符

处理方式：

1.将注释干掉（一般不推荐使用）

2.在出现重复字符的盒子里面加上margin-right:-3px;

3.第二个解决方案是把父容器增加3px宽度

_属性名：属性值（_margin-right:30px）：盒子右边距离30px,如果有下划线，该属性只能被IE6支持