仿照Chome的GhostPage调试功能

  今天在测试过程当中发现了网站的一个bug，在大屏幕上是自适应的，小屏幕笔记本上高度不是自适应，html的高度并非浏览器的高度，小屏幕老是差了一截，在调试过程当中偶然发现差的那一小截正好是一个横向滑动条的高度，立马想到缘由，应该是某些隐藏的元素撑开了宽度。

有两种方案:

第一种只是应急方案：

1 body,html{
2   overflow-x: hidden;
3 }

这种方法能够解决眼前的问题，可是并非根本缘由所在。

 第二种方案：调试方案

在网上看到了有一个谷歌商店的插件：GhostPage，谷歌浏览器安装后 ，页面会变成：

                                                                          

插件会修改页面全部元素的颜色，和边框，这样相对于黑色的背景来讲，边框会很明显，能够看出是哪一个元素撑开了。

但必须得在谷歌商店下载，目前访问不了，没有FQ。可是咱们能够手动在页面加上以下代码，也能够达到相同的效果：

1 *{
2   background: #000 !important;
3   color:#0f0 !important;
4   outline: solid #f00 1px !important
5 }

去试试吧......