用这个工具测试网页兼容性，能快速解决哪些具体问题？

你是不是被浏览器怪异的表现折腾得头疼？

说实话，网页一上线，哪几个浏览器跑起来不顺，ICU你。。

Chrome 好像挺顺，IE 那就… 嗯，别提了。

咱就是说你可能已经在调试里花了好几个小时，心情复杂。。

兼容性测试到底能帮你搞定什么？

先说点正事：兼容性测试就是让你在各种浏览器里一次看见页面到底怎么渲染。

那它解决的是啥？主要是布局错位、CSS不一致、JS报错，还有响应式断点失效。

大体上... 比如说你的 Flexbox 在 Safari 上会把列压成一行；或者你的图片在 IE11 上被拉伸成奇形怪状。

公正地讲... 再比如说某些字体在 Firefox 上会闪退；又或者你的表单验证在 Edge 上根本不生效。

这些问题都可以通过截图对比一次搞定，而不是到处跑去手动刷新。

为什么要用工具而不是自己手动切换?

我记得第一次看到 Safari 把图片乱掉，我都想抓狂。哈哈，那时我还没学会怎么快速定位。

太硬核了。 如果只靠自己手动切换， 每次都要打开 Chrome、Edge、Safari，然后再敲回车，你会累到头发都掉光。

心情复杂。 更重要的是你需要保证同一时间点比较，否则页面主要原因是缓存或网络延迟导致后来啊不一致。

Main Tool：BrowserStack 的快照功能

This tool 会给你一个“网格”视图， 一行代表一个浏览器，一个列代表一个版本，极度舒适。。

只要点击一下就能弹出所有截图。你可以一边看到 Chrome 最新版、 蚌埠住了！ IE10/11 和 Safari 14.

别纠结... 再说一个，它还能模拟不同分辨率，比如 iPhone X 的375x812像素，让你直观看到移动端效果是否正常。