局域網訪問本地網站排版錯亂的常見原因與響應式佈局建議

現象

本機瀏覽器訪問 Apache + PHP + Bootstrap 網站正常，同局域網同事訪問卻排版嚴重錯亂。

可能原因

1. 螢幕分辨率/縮放比不同：CSS 中使用固定像素寬度、絕對定位，未採用響應式單位（%、vw/vh、rem）。
2. 瀏覽器內核/版本差異：同事使用舊版 IE/Edge，CSS3 屬性（Flexbox、Grid）不支援或需前綴。
3. 靜態資源加載失敗：引用相對路徑 css/bootstrap.css，在子目錄頁面下解析錯誤（同樣需用根路徑 /css/...）。

排查步驟

1. 對比雙方瀏覽器開發者工具 Network 面板，確認 CSS/JS 是否 200 OK。
2. 檢查 Console 是否有 CSS 解析錯誤或 JS 報錯阻塞渲染。
3. 在 CSS 中補充 meta viewport、使用 Bootstrap 響應式網格、避免寫死像素寬度。