iOS上的Safari浏览器中未显示电话号码。

Question

我有一个HTML页面，其中包含以下文本：

<font face="Tahoma, Geneva, sans-serif">Please contact our sales person by email: [e-mail] or by phone: [phone]</font>

除了iOS上的Safari浏览器外，它在每个浏览器中都表现良好。该号码已经存在，您可以单击该号码，然后iOS设备会提示您拨打此号码。只是看不见。

我找到的解决方案之一是将以下代码添加到页面头部：

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

这个号码变得可见了，但是Safari不再将其识别为电话号码，因此用户无法通过点击来拨打电话。

另一个解决方案是将电话号码变成链接：

<a href="tel:[phone]" style="color:#000">888-888-8888</a>

但在这种情况下，IE实际上试图转到“tel:[phone]”链接，因此这根本不是最好的解决方案。

那么问题是：是否可能在iOS设备的Safari中将电话号码保留为文本，但使其可见并识别为电话号码？

其他信息：

字体是白色的，因为在CSS文件中为链接指定了白色。我不想更改它，因为这会影响所有其他应该是白色的链接。只有iOS上的Safari才会从电话号码创建超链接。

- user3507225

Answer 1

这个解决方案对我很有用

a[href^=tel] {
    color: inherit;
    text-decoration: none;
}

我在这里找到了它：https://css-tricks.com/forums/topic/phone-numbers-not-displaying-in-safari/ 似乎这是一个奇怪的CSS问题，与Safari处理数字的方式有关。

- Teegan

---

对我有效，谢谢！ - JEricaM

Answer 2

尝试创建一个独立的链接类，该类与原始链接相同，并使代码中的每个链接都成为该类的链接。将电话号码保留为纯文本即可。这应该可以解决问题。

- Dzmitry Sevkovich

Answer 3

字体标签已经过时，不应该再使用。它在HTML 4.01中被弃用，在HTML 5中完全不受支持。

如果您通过CSS应用文本样式，它应该会在移动Safari中显示。

而不是：

<font face="Tahoma, Geneva, sans-serif">Please contact our sales person by email: [e-mail] or by phone: [phone]</font>

尝试：

<span style="font-family: Tahoma, Geneva, sans-serif;">
      Please contact our sales person by email: [e-mail] or by phone: [phone]
</span>

理想情况下，您应该使用样式表来指定页面的呈现方式，但如果您只是想要一个即插即用的解决方案，那也应该可以。不过，请确保编写有效的HTML，这样就不会遇到这种问题了。

- hoverbikes

Answer 4

似乎iOS会将电话号码转换为锚点，即使它不在锚点中。给它一个类或ID，然后样式化你的锚点。

.contact { }
.contact a { text-decoration: none; color: #000000; }

- SteveAustin