如何防止 iPhone 超連結字體大小改變方向？

如何在iPhone 方向變更期間保持超連結字體大小

開發行動Web 應用程式時，在不同裝置方向上保持一致的使用者體驗是非常重要的至關重要的。這包括保留文字元素的樣式，例如字體大小。

在 iPhone 上渲染超連結時會出現一個問題。預設情況下，從縱向模式切換到橫向模式時，超連結的字體大小會顯著增加。這會破壞視覺美感和可讀性。

解決方案：使用-webkit-text-size-adjust 停用文字大小縮放

要解決此問題，您可以使用-webkit-text-size-調整CSS 屬性。此屬性可讓您在方向變更期間停用字體大小縮放，同時仍允許使用者放大或縮小。

以下是實現此解決方案的方法：

html {
    -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}

透過設定-webkit- text-size-adjust 屬性設定為100%，可以有效地抵消裝置在橫向模式下放大文字的預設行為。因此，無論設備方向如何，超連結都將保持其字體大小。

範例：

在您提供的範例中：

ul li a {
    font-size:14px;
    text-decoration: none;
    color: #cc9999;
}

將-webkit-text-size-adjust 屬性新增至HTML 元素將確保超連結在兩個縱向中都保留其14px 字體大小和橫向方向。

以上是如何防止 iPhone 超連結字體大小改變方向？的詳細內容。更多資訊請關注PHP中文網其他相關文章！