摘要：前言自己找了各种兼容问题，我把它们给归纳在一起了。而兼容就是一种办法，能让你在一个里面独立的写支持不同浏览器的样式。解决方法统一用来取得为的对象。八问题问题说明只能在下运行，而不能在下运行，这是因为的只能在事件发生的现场使用。
前言
自己找了各种兼容问题，我把它们给归纳在一起了。希望大家不要见怪！
什么是浏览器兼容：当我们使用不同的浏览器（Firefox IE7 IE6）访问同一个网站，或者页面的时候，会出现一些不兼容的问题，有的显示出来正常，有的显示出来不正常，我们在编写CSS的时候会很恼火，修复了这个浏览器的问题，结果另外一个浏览器却出了新问题。而兼容就是一种办法，能让你在一个CSS里面独立的写支持不同浏览器的样式。这下就和谐了。呵呵！css兼容技巧 1. 问题一
为什么FF 下文本无法撑开容器的高度？
标准浏览器中固定高度值的容器是不会象IE6 里那样被撑开的, 那我又想固定高度，又想能被撑开需要怎样设置呢？
解决方法： 去掉height 设置min-height:200px; 这里为了照顾不认识min-height 的IE6 可以这样定义：
div {
height:auto!important;
height:200px;
min-height:200px;
}
兼容代码:兼容最推荐的模式。
/* FF */
.submitbutton {
float:left;
width: 40px;
height: 57px;
margin-top: 24px;
margin-right: 12px;
}
/* IE6 */
*html .submitbutton {
margin-top: 21px;
}
/* IE7 */
*+html .submitbutton {
margin-top: 21px;
}
2.各种样式表的属性的兼容
解决方法：IE用-ms-，Firefox用-moz-，Opera用-o-，Safari、多款手机浏览器用-webkit-
比如：CSS里设定阴影的属性
/* 原型是 */ box-shadow: 1px 1px 3px #999; /* 要补上兼容代码*/ -moz-box-shadow: 1px 1px 3px #999; /* Firefox */ -webkit-box-shadow: 1px 1px 3px #999; /* Safari*/ -o-box-shadow: 1px 1px 3px #999; /* Opera */ -ms-box-shadow: 1px 1px 3px #999; /* IE */3.居中问题
垂直居中.将 line-height 设置为 当前 div 相同的高度, 再通过 vetical-align: middle.( 注意内容不 要换行.)
水平居中. margin: 0 auto;(当然不是万能)
提醒：作为外部 wrapper 的 div 不要定死高度, 最好还加上 overflow: hidden.以达到高度自适应
js兼容技巧 一、document.formName.item(”itemName”) 问题问题说明：
IE下，可以使用 document.formName.item(”itemName”) 或 document.formName.elements["elementName"]；
Firefox 下，只能使用document.formName.elements["elementName"]。
解决方法：统一使用document.formName.elements["elementName"]。
二、集合类对象问题问题说明：
IE下，可以使用 () 或 [] 获取集合类对象；Firefox下，只能使用 [ ]获取集合类对象。
解决方法：统一使用 [] 获取集合类对象。
三、自定义属性问题问题说明：
IE下，可以使用获取常规属性的方法来获取自定义属性，也可以使用 getAttribute() 获取自定义属性；
Firefox下，只能使用 getAttribute() 获取自定义属性。
解决方法：统一通过 getAttribute() 获取自定义属性。
四、eval(”idName”)问题问题说明：
IE下，可以使用 eval(”idName”) 或 getElementById(”idName”) 来取得 id 为 idName 的HTML对象；
Firefox下，只能使用 getElementById(”idName”) 来取得 id 为 idName 的HTML对象。
解决方法：统一用 getElementById(”idName”) 来取得 id 为 idName 的HTML对象。
五、变量名与某HTML对象ID相同的问题问题说明：
IE下，HTML对象的ID可以作为 document 的下属对象变量名直接使用，
Firefox下则不能；Firefox下，可以使 用与HTML对象ID相同的变量名，IE下则不能。
解决方法：使用 document.getElementById(”idName”) 代替 document.idName。最好不要取HTML对象ID相 同的变量名，以减少错误；在声明变量时，一律加上var关键字，以避免歧义。
六、const问题问题说明：
Firefox下，可以使用const关键字或var关键字来定义常量；
IE下，只能使用var关键字来定义常量。
解决方法：统一使用var关键字来定义常量。
七、input.type属性问题问题说明：
IE下 input.type 属性为只读；但是Firefox下 input.type 属性为读写。
解决办法：不修改 input.type 属性。如果必须要修改，可以先隐藏原来的input，然后在同样的位置再插入一 个新的input元素。
八、window.event问题问题说明：
window.event 只能在IE下运行，而不能在Firefox下运行，这是因为Firefox的event只能在事件发生的现场使用。
解决方法：
在事件发生的函数上加上event参数，在函数体内(假设形参为evt)
使用 var myEvent = evt?evt:(window.event?window.event:null)
示例：