當PageSpeed Insights檢測到網頁內容不適合在指定尺寸的視口內水平顯示，而強制用戶水平移動網頁以查看所有內容時，就會觸發(fā)此規(guī)則。

在桌面設備和移動設備上，用戶習慣于垂直（而非水平）滾動瀏覽網站，而強制用戶水平滾動或縮小以查看完整網頁會給用戶帶來很差的體驗。

在使用元視口代碼開發(fā)移動網站的過程中，您往往會在無意中創(chuàng)建并不適用于指定視口的網頁內容。例如，如果在視口中顯示大于視口寬度的圖片，會迫使用戶水平滾動該視口。您應調整此內容，使其符合視口的寬度。這樣一來，用戶就不用水平滾動視口了。

不同的設備其屏幕尺寸會有很大的差異（例如，手機和平板電腦，甚至是不同款的手機），為此您應配置相應視口，以便您的網頁能在許多不同的設備上正確呈現。然而，由于視口寬度（以CSS像素為單位）可能會有所不同，因此，您的網頁內容不應依賴于能正常顯示的特定視口寬度。

• 避免為網頁元素設置較大的絕對CSS寬度（例如，div{width:360px;}），因為這可能會導致該元素在寬度較窄的設備（例如，像iPhone這類其寬度為320 CSS像素的設備）上顯得過寬。請考慮使用相對寬度值（例如，width:100%）。同樣，您應注意使用較大的絕對定位值可能會導致元素超出較小屏幕的視口。
• 如有必要，您可以使用CSS媒體查詢為較小或較大屏幕應用不同的樣式。這篇HTML5 Rocks文章提供了有關如何實現這一目標的進一步建議。
• 針對圖像，請參閱這篇文章，其中提供了有關如何在網頁呈現期間且在不產生不必要網頁重排的情況下提供相應大小圖片的完整概覽。

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 3.0 License, and code samples are licensed under the Apache 2.0 License. For details, see our Site Policies.