測試響應式的網站可以有很多方式,下面為大家分享的是使用 Chrome 擴充套件版的 RWD 測試工具「Responsive Web Design Tester」測試效果也不錯哦,下面來看看介紹。
使用教程
下載 「Responsive Web Design Tester」Chrome 擴充套件,安裝後,瀏覽器右上角會多出一個擴充套件圖示,點選他就可以設定當前網站用什麼樣的裝置來展示了,如下圖:
新增裝置
此擴充套件預設有流行的移動裝置,Apple、Android、平板等等已經很齊全了,然而你若想新增其它,可以通過設定該擴充套件了新增,並且支援新增使用者代理(User-Agent)。
Step 1: 右擊擴充套件圖示,在彈出的選單選擇「選項」即要調出設定介面:
Step 2: 點選「New Device」按鈕,並設定對應的名稱解析度即可。
對於不懂新增User Agent 的可以隨機新增,或複製其它選項的`,又或者檢視 User Agent List 這個列表來新增對應的使用者代理。
RWD Tester Chrome 擴充套件特色
以簡潔的新視窗形式展示網頁(無URL 位址列、書籤欄等干擾)
方便快捷的檢視方式(直接在瀏覽器右上角圖示選擇檢視,也支援滑鼠右鍵)
可自定義解析度