问题:
我在一个<em>181xxxx234</em>这是一个电话标签, 我在js代码中使用
javascript
document.getElementById('callButton').addEventListener('click', function() {
// 替换下面的电话号码为你想拨打的电话号码
window.location.href = 'tel:+1234567890';
});
实现了点击这个标签调出手机的电话功能, 目前所有设备都是正常的.
我在这个元素中设置了css属性是蓝色的, 也就是这181xxxx234电话号码是蓝色的, 用户一看就是可以点击的, 我是给em加上了蓝色的color, 所有设备都是正常的, 只有ios的safari设备是不正常的, 蓝色没有显示, 显示的是黑色, 使用了所有的方法都加不上去这个蓝色,
当不知为什么的时候, 同时使用一根线 ,连接了手机和电脑, 使用电脑的safari进行调试, 调试后发现safari自动给你加上了一个a标签, 原因是safari浏览器看见你是一个tel的元素, 他就给你自动加上a标签, 导致em上的蓝色无法作用到内部新增的a标签中, 所以:
在safari中的形式:
<em>
<a>181xxxx234</a>
</em>
多了一层a标签导致的, 我们多谢一段css:
em a{
color: #xxxx;
}
这样我们的元素就生效了, 成为蓝色了.