網頁設計師在設計網頁時,除了要考慮各種瀏覽器的相容性外,還要考慮在不同解析度下的瀏覽情形,若透過輔助工具來協助就可以節省不少繁瑣的測試步驟。
這篇文章介紹的Google瀏覽器外掛可用來調整瀏覽器視窗的大小,模擬網頁在各種螢幕解析度下的顯示情形。外掛內建八組常用的解析度設定,點一下就可以馬上切換若要測試比較特殊的解析度也可以透過外掛的功能來自訂、新增各種不同的解析度設定,功能非常棒!
外掛名稱:Window Resizer
外掛網址:http://4fun.tw/Wo4RR (4fun.tw縮網址)
安裝使用Window Resizer
打開外掛網頁後直接點選【安裝】下載外掛。
※ 需使用 Google Chrome 才可安裝
安裝完成後,在網址列右邊會看到如下圖紅色框框的按鈕,點下去就會出現各種不同的解析度認你選擇。
▲ 解析度切換為 800*600 明顯看到網頁寬度比螢幕大。
自訂新的解析度設定
如果預設的解析度清單沒有你想要使用的,可以選擇【Edit resolutions】來新增。
輸入新解析度的寬度(Width)、高度(Height)後,按下 【Save】儲存設定,再按下【Finish editing】完成編輯。
剛才新增的解析度就會顯示在清單裡了。
謝謝分享! 很好用~