Question

我正在尝试设置此按钮的样式，以使文本为白色，并且与其他社交媒体按钮一样具有白色边框。我用于所有这些按钮的代码是相同的，并且在预览HTML时按钮具有所需的属性，但是由于某些原因，当我上载文件并访问网站（josholadunni.com）时，LinkedIn的按钮为紫色，没有边界。任何帮助将不胜感激！

.fa {
  padding: 10px;
  font-size: 30px;
  width: 50px;
  text-align: center;
  text-decoration: none;
}

.fa:hover {
  opacity: 0.7;
}

.fa-facebook {
  background: transparent;
  color: white;
  border-color: white;
  border-style: solid;
}

.fa-linkedin {
  background: transparent;
  color: white;
  border-color: white;
  border-style: solid;
}

.fa-instagram {
  background: transparent;
  color: white;
  border-color: white;
  border-style: solid;
}

<div id="socialmedia">

  <a href="https://www.facebook.com/oladunnidesign/" class="fa fa-facebook" target="_blank"></a>
  <a href="https://www.linkedin.com/in/josh-oladunni-96a893b8/" class="fa fa-linkedin" target="_blank"></a>
  <a href="https://www.instagram.com/JoshOladunniDesign/" class=" fa fa-instagram" target="_blank"></a>
</div>

Answer 1

链接具有一个名为:visited的伪元素，在您访问链接所指向的URL后，它们会应用一些默认样式。您不仅应将样式应用于.fa，还应将样式应用于.fa:visited，以获得所需的结果。

为什么此链接变成紫色并失去其样式属性？

1 个答案: