h5点击电话号跳转手机拨号

avatar
作者
筋斗云
阅读量:0

需要使用到h5的 <a>标签

我们首先在<head>标签中添加代码

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

然后再想要的位置添加代码

 <a href="tel:10086"> 点击拨打:10086 </a>

这样功能就实现了,完整代码如下:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>打电话</title> <meta name="format-detection" content="telephone=yes"/> </head> <body>   <a href="tel:10086"> 点击拨打:10086 </a>  </body> </html>

这样最重的样式是这样的

如果你不想要这个下划线,可以在样式中修改,给<a>标签添加一个class属性,如:

 <a href="tel:10086" class="phone_point"> 点击拨打:10086 </a>

然后再style中添加样式:

.phone_point{   text-decoration: none; }

这样就可以了,完整代码如下:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>打电话</title> <meta name="format-detection" content="telephone=yes"/> </head> <body> <a href="tel:10086" class="phone_point"> 点击拨打:10086 </a>  </body> <style> .phone_point{   text-decoration: none; } </style> </html>

最终效果:

广告一刻

为您即时展示最新活动产品广告消息,让您随时掌握产品活动新动态!