桌上型電腦、筆電、手機的螢幕都有各種不同的大小比例,所以現在設計網頁除了需要支援不同的瀏覽器外,還要考量到在不同螢幕尺寸上的呈現效果,但市面上螢幕尺寸百百種,很難全部都拿來測試,說實在也沒那個閒工夫,這時像「everysize」這樣的網頁服務就很實用了!
它是一個可以將網頁套入各種螢幕尺寸的線上工具,,
除了預設的四個螢幕外,可再新增更多,讓你輸入一次網址就能看到所有需測試的螢幕尺寸,省時又省力哦!
- 網站名稱:everysize
- 網站網址:https://everysize.kibalabs.com/
網頁畫面:
開啟網頁後,在右下方輸入或貼上欲測試的網頁網址,再按下「GO」。
接著就能看到在預設的四種螢幕尺寸中,網頁的呈現效果。如果想要一次套用在更多不同的螢幕中,可點擊右下角的「+」新增更多虛擬螢幕。在這些虛擬螢幕中的網頁連結都是真的可以作用的。
顯示的比例預設為 40%,在虛擬螢幕左上角下拉百分比選單,可切換不同的比例。在右側可手動輸入需要的螢幕尺寸。
點擊虛擬螢幕最上方的名稱可展開行動裝置清單,裡頭有一些常見的手機型號可選用。不過選單都白白一片,滑鼠移過才會知道有什麼選項。
,