如何在iPhone / iOS上删除蓝色样式的电话号码？ [英] How do I remove the blue styling of telephone numbers on iPhone/iOS?

问题描述

在iPhone上查看时，是否有从电话号码中删除默认蓝色超链接颜色的方法？像特定的Mobile Safari标记或CSS添加？

Is there a way to remove the default blue hyperlink colour from a telephone number when viewed on an iPhone? Like a specific Mobile Safari tag or CSS to add?

我只有这个数字：

<p id="phone-text">Call us on <strong>[phone]</strong></p>

没有超链接，但iPhone仍然将此文本编号作为超链接。我在某些网站上遇到此渲染问题，但无法看到为什么会发生。

And there are no hyperlinks but iPhone still renders this text number as a hyperlink. I have this rendering issue on some of my websites but can't see why this is occurring.

我读过这篇文章：

移动HTML呈现数字

但是是唯一的解决方案吗？

But is that the only solution possible?

推荐答案

两个选项...

要删除电话号码的所有自动格式化，请将其添加到 html 文档的头：

To remove all auto-formatting for telephone numbers, add this to the head of your html document:

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

查看更多 Apple特定元标记键。

strong>注意：如果您在网页上有这些号码的电话号码，则应手动将其格式化为链接：

Note: If you have phone numbers on the page with these numbers you should manually format them as links:

<a href="tel:[phone]">1-555-555-5555</a>

---

2。无法设置元标记？想要使用 CSS ？

当您无法设置元标记时在链接/锚点标签（< a href =>< / a> ）中添加电话号码，然后使用类似于以下内容的css您需要重置的特定属性：

---

2. Can't set a meta tag? Want to use CSS?

When you can't set a meta tag—such as in html email—wrap phone numbers in link/anchor tags (<a href=""></a>) and then target their styles using css similar to the following and adjust the specific properties you need to reset:

a[x-apple-data-detectors] {
  color: inherit !important;
  text-decoration: none !important;
  font-size: inherit !important;
  font-family: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}

如果您要定位特定链接，请在链接上使用类，上面的css选择器到 a [x-apple-data-detectors] .class-name 。

If you want to target specific links, use classes on your links and then update the css selector above to a[x-apple-data-detectors].class-name.

这篇关于如何在iPhone / iOS上删除蓝色样式的电话号码？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！