在編輯完部落格後,是否也曾經發現我們在手機上看到的效果和電腦上不太一樣?是否有模擬器可以呈現出來?其實在Chrome瀏覽器上就有此功能了,只要善用此功能,不用再去抓其它的模擬器了。
要呼叫出此功能,個人所知共有三個方法。只要在Chrome瀏覽器內,依照以下方法設定即可可
方法一
- 按「F12」
方法二
- 按「Shift」+「Ctrl」+「i」
(廣告)
方法三
如果以上快速鍵背不起來,還可以使用下列的方法設定
步驟一、點右上箭頭所指的「三個點」
步驟二、選擇「更多工具」
步驟三、選擇「開發人員工具」
步驟四、點選「手機、平板」的圖示。
步驟五、點選下圖紅框處,選擇「手機、平板」的樣式
步驟六、實際畫面就如下所示。若呈現出來的結果怪怪的,可以更新一下網頁,或是重新貼上、點到我們要看的網頁。
(廣告)
當我們型號清單內,找不到我們想要模擬的手機、平板型號時,可以點選最下面的「Edit」來做新增的動作。
點選「EDIT」後,在視窗右方會呈出下面選單。
1、點選「Add custom device」
2. 輸入 裝置名稱,此處我們輸入 OPPO R11.
3. 依序輸入「寬」、「長」。此處我們輸入68、122。不用輸入單位
4. SAVE
修改後,該型號即可在清單中被選擇。並可如設定顯示在我們的瀏覽器中。
全站熱搜
留言列表