我很常使用 ResponsivePX.com 來找 Responsive 網頁的斷點,透過這個方式,可以加快我修正 h1、h2 等標題文字跳行 Bug 的速度。ResponsivePX 的介面非常簡單,只要輸入你要檢查的網址,然後調整 Width 和 Height 就行了。

ResponsivePX.com

ResponsivePX.com

不過要注意的是,ResponsivePX 不支援手機裝置模擬,像你把 apple.com 丟進去是看不到手機模式的,你必須使用 Chrome 的開發者工具(按右鍵 → 檢查元素 → 左上角手機符號 Toggle device mode)。

Chrome 開發者工具

Chrome 開發者工具

徐仲威

徐仲威,拍底片的網頁設計師。1986 年生於板橋浮洲,2009 年畢業於台科大企管系。2017 年成立個人網頁設計工作室,專注於網站規劃、設計與製作至今。 工作之外,是一個孩子的父親。平常帶小孩時,習慣拿相機取代滑手機。比起單純的影像,更喜歡文字與影像放在一起之後,多出來的層次。 網頁設計工作與作品:xuzhongwei.tw

歡迎留言,我都會回