前端面试问题之兼容问题

兼容问题一般都是面试必问问题，今天搞明白！！！

浏览器兼容问题一：不同浏览器的标签默认间距不同
出现问题：当我们布局的时候，在不加样式控制的情况下，各自默认的margin和padding差异较大。
解决方案： 在css开头中使用通配符*，设置各个标签的margin和padding值为0，就可以了。

浏览器兼容问题二：块属性标签float后，又有横行的margin情况下，在IE6显示margin比设置的大。
出现问题：常见症状是IE6中后面的一块被顶到下一行。
解决方案：在float的标签样式控制中加入 display:inline;将其转化为行内属性。
备注：我们最常用的就是div+CSS布局了，而div就是一个典型的块属性标签，横向布局的时候我们
通常都是用div float实现的，横向的间距设置如果用margin实现，这就是一个必然会碰到的兼容性问题。

浏览器兼容问题三：图片默认间距问题
出现问题：几个img标签放在一起的时候，有些浏览器会有默认的间距，通配符清除间距也不起作用。
解决方案：使用float属性为img布局
备注：因为img标签是行内属性标签，所以只要不超出容器宽度，img标签都会排在一行里，但是
部分浏览器的img标签之间会有个间距。去掉这个间距使用float是正道。（也可使用负margin，
虽然能解决，但负margin本身就是容易引起浏览器兼容问题的用法，所以尽量不要使用）

浏览器兼容问题四：变迁最低高度设置min-height不兼容
出现问题：因为min-height本身就是一个不兼容的CSS属性，所以设置min-height时不能很好
的被各个浏览器兼容
解决方案：如果我们要设置一个标签的最小高度200px，需要进行的设置为：
{min-height:200px; height:auto !important; height:200px; overflow:visible;}
备注：在B/S系统前端开发时，有很多情况下我们有这种需求。当内容小于一个值（如300px）时。
容器的高度为300px；当内容高度大于这个值时，容器高度被撑高，而不是出现滚动条。这
时候我们就会面临这个兼容性问题。

兼容问题五：
innerText的问题
问题：
innerText 在IE中能正常工作，但是innerText 在FireFox中却不行
解决方法：
在非IE浏览器中使用textContent代替innerText。

兼容问题六：
超链接点击过后hover样式就不出现的问题？
被点击访问过的超链接样式不再具有hover和active样式了,解决方法是改变CSS属性的排列顺序: L-V-H-A
 a:link {} a:visited {} a:hover {} a:active {}