删除Microsoft Edge的电话号码样式

我注意到新的Microsoft Edge浏览器在检测到电话号码时会覆盖我的样式：

<span class="phone">(123)123-1234</span>

请参见此jsfiddle（必须使用Microsoft Edge：P打开）。

这种行为干扰了网站的设计，并且令人讨厌。当然，这似乎是IE的后继者的特征：/

如何覆盖或禁用此功能，以便我的网站用户看不到它？

您可以通过在页面标题中添加此meta标签来摆脱它。

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

Microsoft在此标签上的文档。

希望有一种更好的方法可以在不使页面膨胀的情况下全局关闭此功能。或者最好还是默认禁用此功能。

如果您不想按照所选答案建议禁用整个页面，则可以将以下属性添加到特定标签

<p x-ms-format-detection="none">

参考：https : //docs.microsoft.com/zh-cn/previous-versions/windows/internet-explorer/ie-developer/dev-guides/dn265018(v=vs.85)#controlling-phone-number-detection

上面的答案非常有效，但是会禁用单击呼叫电话号码的功能（如果您正在构建响应站点，这是一个主要问题）。我发现更好的解决方法是使电话号码成为链接。例：

<a href="tel:888-888-8888">(888) 888-8888</a>

然后，这将使您可以根据需要设置“链接”的样式，并且CSS中的“ a”样式将覆盖电话号码上的Edge和iPhone样式。唯一的问题是它使电话号码成为所有设备的链接，但是我发现这并不是问题，因为几乎每个设备都包含某种点击通话功能或应用程序。

我已经遇到了这个问题，但是用例略有不同：突出显示的数字不是电话号码，因此我不需要任何特殊的格式。

例如，您可能有类似以下内容：

<div>The current date/time: May 08 2017 10:44:58 GMT Daylight Time</div>

对于我*，Edge将转换08 2017 10为电话号码链接。谢谢，Edge！

我发现您可以通过inline-block在字符串中间插入不可见元素来解决此问题：

.notel{
  display:inline-block;
  height:0px;
  width:0px;
}

<span class="phone">(763)219-5222</span>
<div>The current date/time: May 08 2017 10:44:58 GMT Daylight Time</div>

<br>
<span class="phone">(763)2<span class="notel"></span>19-5222</span>
<div>The current date/time: May 08 2<span class="notel"></span>017 10:44:58 GMT Daylight Time</div>

我看不到这对您的电话号码是否有效，因为在任何一种情况下都不会突出显示。您可能需要微调跨度的位置。

顺便说一句，您可以执行此操作是您不应该将命令从网页复制到终端的众多原因之一：

span{
display:inline-block;
height: 0px;
width: 0px;
overflow:hidden;
}
textarea{
  width: 300px;
  height:50px;
}

<div>echo "HELLO" <span>&& wreck this machine</span></div><div>echo "WORLD"</div>

<textarea ></textarea>
<div>
Select, copy and paste above commands into the textarea.
</div>

*我认为Edge突出显示的数字是区域性的。您的jsfiddle没有为我突出显示，但我在英国。这里似乎突出显示了以0开头的数字。