如何在iPhone/iOS上删除电话号码的蓝色样式?

在iPhone上查看电话号码时，是否有办法删除默认的蓝色超链接颜色?像一个特定的移动Safari标签或CSS添加?

我只在数字的地方有这个:

<p id="phone-text">Call us on <strong>+44 (0)20 7194 8000</strong></p>

这里没有超链接，但iPhone仍然将这个文本数字显示为超链接。我在我的一些网站上有这个渲染问题，但不明白为什么会发生这种情况。

我确实读过这篇文章:

移动HTML渲染数字

但这是唯一可行的解决方案吗?

当前回答

将数字放在<fieldset>中将阻止iOS出于某些原因将数字转换为链接。在某些情况下，这可能是正确的解决方案。我并不提倡完全禁用链接转换。

其他回答

尝试将ASCII字符的破折号放在数字分隔之间。

从这里:-

到此:–

例如:change 555-555-5555 => 555–555–5555

如果你只是想避免电话号码作为链接，可以使用字体标签:

<p>800<font>-</font>555<font>-<font>1212</p>

如果你想保留电话号码的功能，但只是为了显示而删除下划线，你可以将链接样式设置为任何其他:

a:link {text-decoration: none; /* or: underline | line-through | overline | blink (don't use blink. Ever. Please.) */ }

我还没有看到建议将类应用于电话号码链接的文档，因此您必须向想要具有不同风格的链接添加类/id。

或者你可以使用以下方法来设置链接的样式:

a[href^=tel] { /* css */ }

iPhone可以理解这一点，但其他UA并不适用(据我所知，Android、黑莓等平台的用户/开发者也可以对此发表评论)。

Joomla Yootheme对我来说很有用:

a:not([class]) {
    color: #fff !important;
}

这对我来说很管用:

.appleLinks a {color:#000000;}
.appleLinksWhite a {color:#ffffff;}

你可以在这里找到更多信息。

推荐文章