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

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

DDD
發布: 2024-11-25 15:12:13
原創
640 人瀏覽過

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中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板