簡單來說就是用電腦的瀏覽器看手機板網頁，不使用模擬器
雖然有些網頁會提供手機版網頁的連結，但很多都是沒有提供的
～～～萌萌噠的分割線醬～～～
首先打開google chrome瀏覽器，在你想要看的網頁上按下Ｆ１２
![[教學]如何在電腦版的google chrome瀏覽器上面看手機版網頁](https://techscomet.com/wp-content/uploads/__pic_pimg_tw_asd0961296920_1608890726-407930728-g_n_png.png)
然後在右上角的小正方形圖案點下去，可以看到已經變成手機板的大小惹
![[教學]如何在電腦版的google chrome瀏覽器上面看手機版網頁](https://techscomet.com/wp-content/uploads/__pic_pimg_tw_asd0961296920_1608890783-3723655797-g_n_png.png)
不過網頁還是電腦版的格式，怎麼辦？
很簡單，只要按下右鍵，重新整理之後網頁就會變成手機板的格式了～
![[教學]如何在電腦版的google chrome瀏覽器上面看手機版網頁](https://techscomet.com/wp-content/uploads/__pic_pimg_tw_asd0961296920_1608890886-1328691120-g_n_png.png)
不過要注意的是右邊的原始碼視窗不能關掉，不然網頁會整個走型變得非常大～
▶除了上述方法外，還可以使用Chrome擴充功能來模擬手機瀏覽器。例如，”User-Agent Switcher for Chrome”擴充功能可以切換瀏覽器的User-Agent，讓網站誤以為你是使用手機瀏覽器，從而載入手機版網頁。這種方法的好處是可以自由設定User-Agent，也可以儲存自己常用的User-Agent設定。
小技巧與應用
| 功能 | 作用 |
|---|---|
| 快捷鍵 | F12 或 Ctrl + Shift + I 可快速開啟開發者工具 |
| 切換解析度 | 可選擇不同裝置型號來模擬不同解析度 |
| 橫向/直向切換 | 點擊旋轉按鈕來模擬手機橫向顯示效果 |
| 強制重新整理頁面 | 切換裝置模式後若無法即時顯示，可按下重新整理按鈕 |
常見問題與解答 (FAQ)
- Q: 為什麼我切換裝置模式後，還是看到桌面版的網頁？
- A: 有時候網站會強制跳轉到桌面版。你可以試著清除快取，或在重新載入時按下
Ctrl + Shift + R（硬重新載入）來刷新頁面。
- A: 有時候網站會強制跳轉到桌面版。你可以試著清除快取，或在重新載入時按下
- Q: 我可以測試不同解析度的顯示效果嗎？
- A: 當然可以！在裝置模式的下拉選單中選擇不同的裝置，或者直接手動設定解析度即可。
- Q: 是否可以在開發者工具中預覽網站在平板上的顯示效果？
- A: 可以，開發者工具提供許多不同型號的模擬裝置，包括手機和平板電腦。選擇適合的型號即可。
- Q: 我能不能直接在這裡測試觸控操作？
- A: 雖然你可以模擬觸控操作，但真實的觸控行為還是需要在真實的觸控裝置上進行更準確的測試。
謝謝你的無私分享(ง •_•)ง,加油
感謝支持(,,・ω・,,) 星夢月影 於 2021/02/23 21:22 回覆
請問如果關掉右邊的原始嗎視窗，手機版畫面變得很大，請問如何變回正常的電腦版畫面呢
把原始碼關掉再重新整理一次就會回到正常的電腦版畫面惹
星夢月影 於 2022/05/23 13:55 回覆