html、css兼容性试题

IE8 下兼容性总结：http://www.hustlzp.com/post/2014/01/ie8-compatibility

IE6下为什么无法定义1px左右高度的容器

IE6下这个问题是因为默认的行高造成的，解决的方法也有很多，例如：overflow:hidden | zoom:0.08 | line一height:1px

 FireFox中标签的居中问题的解决办法

*{margin：0px auto；}

写出几种IE6 bug的解决方法

  1）png24位的图片在iE6浏览器上出现背景，解决方案是做成PNG8.也可以引用一段脚本处理.

  2）IE6双倍边距bug：在该元素中加入display:inline 或 display:block
  3）像素问题 使用多个float和注释引起的 使用dislpay:inline 一3px  
  4）超链接hover 点击后失效  使用正确的书写顺序 link visited hover active
  5）z一index问题 给父级添加position:relative
  6）Min一height 最小高度 ！Important 解决’ 7.select 在ie6下遮盖 使用iframe嵌套
  7）为什么没有办法定义1px左右的宽度容器（IE6默认的行高造成的，使用over:hidden,zoom:0.08 line一height:1px）

请戳出ie6/7下特有的cssbug

一：li边距“无故” 增加

设置ul的显示形式为*display:inline一block;即可，前面加*是只 针对IE6/IE7有效

二：IE6 不支持min一height属性，但它却认为height就是最小高度

使用ie6不支持但其余浏览器支持的属性!important。

三:Overflow:

在IE6/7中，overflow无法正确的隐藏有相对定位position:relative;的子元素。解决方法就是给外包容器.wrap加上position:relative;。

四：border：none 在IE6不起作用： 写成border：0 就可以了

五:100%高度

在IE6下，如果要给元素定义100%高度，必须要明确定义它的父级元素的高度，如果你需要给元素定义满屏的高度，就得先给html和body定义 height:100%;。

六:双边距 Bug

当元素浮动时，IE6会错误的的把浮动方式的margin值双倍计算，给float的元素添加一个display：inline

七：躲猫猫bug

定义了:hover的链接，当鼠标移到那些链接上时，在IE6下就会触发躲猫猫。
     1.在（那个未浮动的）内容之后添加一个<span style=”clear: both;”></span>
     2.触发包含了这些链接的容器的hasLayout，一个简单的方法就是给其定义height:1%;

八:IE6 绝对定位的元素1px 间距bug

当绝对定位的父元素或宽度为奇数时，bottom和right会多出现1px，

解决方案，针对IE6进行hack处理