Question

css浏览器兼容性怎么测试？

Answer 1

一个网页设计的再怎么好看，如果前端排出来的页面兼容性跟不上，那网页在不同浏览器下的表现也不尽相同，可能在IE浏览器下是正常的，但在谷歌浏览器下就错位了。这就是浏览器的兼容性，足以让前端工程师抓狂，因为在前端排版过程中要在不同浏览器下充分测试，相当麻烦。

什么是浏览器兼容性？为什么会存在浏览器兼容性？

我们知道，当下主流的浏览器的背后都是一个个科技类公司，不同公司之间也是存在竞争的，所以每个浏览器厂家都会对自家的浏览器定制化一些功能。也就是因为不同浏览器是由不同厂家开发的，不同版本的浏览器功能也存在差异，所以就衍生出了浏览器兼容性问题。

所春兄谓的浏览器兼容性是指不同浏览器对网页的渲染模式存在差异，比如同样一段HTML和CSS代码，在不同浏览器上解析渲染出来的效果是不同的，比如说：A浏览器默认字体行高大一些，B浏览器默认字体行高小一些等。

常见的浏览器内核

虽然市面上的浏览器很多，但常见的浏览器内核主要有这几款：

1、Trident内核（IE内核）

IE浏览器使用的是Trident内核，像国内互联网公司推出的一些浏览器（360浏览器、百度浏览器、QQ浏览器、猎豹浏览器等）也使用了Trident内核（国内这些浏览器基本上都是双内核，即：IE内核+Webkit内核）。

2、Webkit内核

像Chrome（谷歌）浏览器、Safari（苹果）浏览器使用的是Webkit内核。

3、Gecko内核（火狐内核）

Firefox（火狐）浏览器使用的是Gecko内核，只不过火狐浏览器现在用得不多了。

浏览器兼容性怎么测试？

市面上的主流浏览器那么多，当我们排好一个页面后总不能下载10几个浏览器一一测试吧！其实现在的前端兼容性测试比以前的前端兼容扒弊袭性测试要轻松多了，因为：

现在我们只需要对常见的三四种内核的浏览器进行测卜哪试；

IE低版本不再考虑，以前要考虑IE6、IE7、IE8、IE9等不同版本的兼容性；

手机Wap端页面主要在Webkit内核浏览器下测试即可。

所以前端同学在测兼容性时，主要使用：IE10浏览器、Chrome浏览器进行测试即可。如果非要考虑低版本的IE兼容性，可使用IETester这类工具，另外在浏览器调试模式下可以直接指定IE内核。