使用CSS类格式化href：tel链接

我最近继承了一个完全使用HTML和CSS构建的网站，并使用FTP门户。为了让网站更具移动性，我试图在他们的网站上实施点击通话电话号码。我已经使用了点击呼叫的代码是经典：使用CSS类格式化href：tel链接

<a href="tel:#number">#number></a>

没有为它提供的格式为他们的网站的各种元素的网站主CSS文件。有一个.phonenumber类，它将电话号码设置为48px的大小，使字体变为红色，并使其变为红色。目前，所有的电话号码进行编码，像这样：

<span class="phonenumber"> phone #</span>

然而，当我打开手机＃部分为<a href=tel>这个格式就会消失。尽管链接在<span>之间，但格式似乎不适用。有没有办法使用CSS类来设置点击通话链接的格式？或者手动设置属性，以便该数字保留其红色，48像素格式，同时仍然充当链接？现在看来我可以将它作为链接或格式化。请让我知道是否有解决办法。

来源

2015-07-20 Sad Bones Malone

这听起来像有默认样式发生了'了'标签。只需用标签包裹您的span标签，跨度应该覆盖样式。 – Lee

您可以使用Attribute Selectors到href值的开头匹配"tel"，使用前缀比较^=：

a[href^="tel:"] { 
}

这其中href属性与“电话开始只匹配a标签“值：

例如：

a[href^="tel:"] { 
 
    color: red; 
 
}

<a href="http://www.google.com">Test 1</a><br /> 
 
<a href="tel:+123456">Test 2</a>

来源

2015-07-20 15:56:53 LcSalazar

从技术上讲，这也适用于像这样的东西。 – Anonymous

对不起......现在不行了 – LcSalazar

听起来像CSS选择电话号码通过引用其父母，而不仅仅是跨度。有点像这样：

#parent_container_of_span span

因此，当你改变它到一个链接它打破了CSS。一般来说，也可能会有一些额外的格式适用于混乱的东西。

看看你是否可以进入CSS并找到其中的造型适用于跨度的一部分，将其更改为以下

a[href="tel"] { 
    /*styles here*/ 
}

这应该做的伎俩。

来源

2015-07-20 15:52:27 codedude

当href完全等于'tel'时，这只会将链接定位。 – Anonymous

您只需定位href属性以tel:开头的所有元素。

a[href ^= 'tel:'] { 
    font-weight: bold; 
}

来源

2015-07-20 15:56:29 Anonymous

这就是你需要

a[href^="tel:"] 
{ 
// your desired style 
}

来源

2015-07-20 15:58:41 Kaspersky

使用CSS类格式化href：tel链接

回答

相关问题