網頁上的iPad方向問題

Question

我為PC開發了一個網頁，並希望它也與iPad兼容。 但是，我沒有為iPad兼容性對頁面進行特定添加。 我只添加了meta標簽。

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=1;" />

當我在iPad橫向模式下查看網站時，頁面加載看起來不錯。 但是，當我切換到“人像”模式時，頁面看起來已被切斷。 當我再次切換到橫向模式時，頁面看起來仍被切斷。

為了使我的頁面與iPad兼容，我還應該遵循哪些其他做法。我正在尋找有關使用％widths之類的建議/最佳做法。我的元素目前最大為954px。 我是否必須為iPad兼容性使用％寬度？ 還有其他有用的提示嗎？

Answer 1

initial-scale = 1.0表示您的頁面將加載“全尺寸”，在橫向模式下該尺寸過寬。 如果使用該元標記，通常會結合使用它來調整頁面寬度到屏幕的確切尺寸。 由於您不是，所以我根本不會使用該meta標簽，而是讓iPad的瀏覽器正常加載頁面（瀏覽器將為您處理使其適合屏幕）。