如何在不同的页面css上设置不同颜色的tel链接的样式

Question

我目前在我的网站上有一个电话链接：

HTML

Give us a call today on <a href="tel:+441234123456">01234123456</a>

CSS

a[href^="tel:"] {
  font-size:12px;
  font-color:white;
}

唯一的问题是，在另一个页面上，我将电话号码显示为某些文字的一部分，我需要在此页面上以黑色显示电话号码，我不知道如何覆盖这个？

有什么想法吗？

Answer 1

使用color:属性代替font-color:。

我会这样：

a {
  font-size:12px;
  color: #FFF;
}

您应该为a标记提供课程，如下所示：

<a class="phone-number">+4412666666</a>

为此特定类指定颜色，如下所示：

a.phone-number {
  font-size:12px;
  color: #FFF;
}

祝你好运！

Answer 2

简单回答：在此手机容器中添加特定类。

<a class="phone-green" href="tel:+441234123456">01234123456</a>

然后在css文件中添加一个类修饰符：

a[href^="tel:"].phone-green {
  font-size:12px;
  font-color:white;
}