首頁 >web前端 >css教學 >如何阻止 Mobile Safari 自動設定電話號碼格式?

如何阻止 Mobile Safari 自動設定電話號碼格式?

DDD
DDD原創
2024-11-25 15:12:13654瀏覽

How to Stop Mobile Safari from Auto-Formatting Phone Numbers?

在Mobile Safari 中設定電話號碼樣式

使用Mobile Safari 在iPhone 上查看電話號碼時,遇到預設的藍色超超超超連結令人沮喪造型。這可能會造成不必要的格式不一致並破壞使用者體驗。如果您在網站上遇到此問題,可以使用多種解決方案來刪除藍色樣式。

1.使用元標記停用自動格式化:

將此元標記新增至HTML 文件的頭部:

<meta name="format-detection" content="telephone=no">

此元標記通知Mobile Safari 不要自動格式化電話號碼,允許您手動控制其樣式。

注意:如果頁面上有電話號碼,則應該可點擊,您需要使用「a」標籤手動將它們格式化為連結:

<a href="tel:+1-555-555-5555">1-555-555-5555</a>

2.使用CSS 刪除樣式:

選項1:

href 值以'tel' 開頭的目標連結:

a[href^="tel"] {
  color: inherit;
  text-decoration: none;
  /* Additional CSS styles here */
}

選項2:

對於您的情況無法使用元標記(例如在HTML 電子郵件範本中)、將電話號碼包含在錨標記中並使用CSS定位其樣式:

a[x-apple-data-detectors] {
  color: inherit !important;
  text-decoration: none !important;
  /* Adjust other CSS properties as needed */
}

您也可以在連結上使用類別名稱來定位特定元素.

以上是如何阻止 Mobile Safari 自動設定電話號碼格式?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn