仿照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 }

去試試吧......