最近因為專案所以在開發手機及平板的網頁，當在測試時發現只有iOS的裝置 (iPhone/iPad) 在旋轉後網頁怎麼會自動放大 Android 則一切正常，查了一下原因是出在meta這個 Tag 的設定。

以下是原本的meta

<meta name="viewport" content="width=device-width, initial-scale=1">

原因是在於meta中的 content屬性的設定，首先width=device-width只是單純在設定網頁的寬度要符合顯示螢幕，再來initial-scale=1這就是重點了，這是在設定當網頁載入時的放大比例，這邊設定放大率是一倍，這看起來很像很美好但它並沒有強制縮放比例，僅限於剛載入網頁時才有用。

所以將它修改為minimum-scale=1, maximum-scale=1將網頁的最大及最小縮放比例設為一倍，這樣不管螢幕怎樣旋轉，網頁縮放比例都不會變了。

這是修改後的meta

<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">