浏览器的兼容性问题

1.ie的haslayout是ie的渲染引擎的一部分，确定元素自身的大小和组织内容，或者依赖自己的祖先元素来确定自己的大小和组织自身内容。

 当haslayout为true时，需要自己来渲染自己，这时浮动或者很长很长的截断文字，都需要自己来组织内容确定大小。

为false时就需要依赖父元素。

2.负责组织自身内容的元素，会有默认的布局，例如：*html,body, *table,tr,td,*img,*input,button,file,section,fileset,*marquee(由于设置文字滚动的)，（并不是所有元素都有默认的布局layout，考虑性能和简洁）；

3.haslayout只存在于ie67及更低的版本，

4.当ie出bug时，考虑触发haslayout,  ie6的触发：display:inline,width,height,float,position:absolute,

                                                  ie7的触发：max-;max-height:;min-;min-height:;position:fixed;

                                                  或者zoom：1；

5.ie6浮动时会有双边距，用display:inline;解决，

6.ie6/7的负margin隐藏，给父元素去除haslayout,或者给子元素，position:relative;

7.透明度问题

 opacity：40；在ie6中不好使，需要出发haslayout，zoom:1;filter:alpha(opacity:40);

同时用css Hack来处理，条件，属性，选择符。<!--[if lge IE7]> 样式<[endif]--！>  ie6*和_,ie7*,

---------------------------------------------------------------------------------------------------------------

兼容性问题

1.ie8以前当给元素设置的高小于10px;时，通常会超出所设置的高，因为ie8及遨游，会默认给标签一个高度，即使是空标签；

解决方法：元素overflow：hidden；或者设置line-heigh小于你设置的高度；

2.img标签为行内标签，有些浏览器当图片并排显示时会有间距。

解决方法：给img添加浮动。

3.display:inline-block在ie9以下版本都不能很好的支持;

解决方法：要全都写display:inline-block;*display:inline;zoom:1;css Hack+触发haslayout;

4.用一行代码解决ie678910的兼容性问题。<meta http-equiv="X-UA-compatible" content="IE=IE10">指定使用ie10,

                                                        或者<meta http-equiv="X-UA-Compatible" content="chrome=1"> Google Chrome Frame也可以让IE用上Chrome的引擎:

（http://www.cnblogs.com/yoosou/archive/2012/07/27/2612443.html）

（http-equiv详解：http://kinglyhum.iteye.com/blog/827807）

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />使用最新的ie;
这样写可以达到的效果是如果安装了GCF，则使用GCF来渲染页面，如果没安装GCF，则使用最高版本的IE内核进行渲染。Google Chrome Frame（谷歌内嵌浏览器框架GCF）。这个插件可以让用户的IE浏览器外不变，但用户在浏览网页时，实际上使用的是Google Chrome浏览器内核，而且支持IE6、7、8等多个版本的IE浏览器。

 (备注：http-equiv:可以设置网页的到期时间，缓存cache， cookie，利于搜索殷勤的keywords,description, 设置字符集，).