Question

我想更改页面上所有链接的颜色，但不适用于chrome，适用于歌剧。我不知道发生了什么事，您能帮我使它在每种浏览器上都可以工作吗？

a:link
{
  color: rgb(255, 169, 73);
  text-decoration: none;
}

<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Lake Towada</title>
    <link rel="stylesheet" href="CSS/style.css">
  </head>

<body>
    <p>
      some text<a href="https://www.japan-guide.com/e/e3775.html" target="-_blank">Oirase</a>
      some text<a href="https://www.japan-guide.com/e/e3780.html" target="-_blank">the mountains</a>some more text
      </p>
</body>

Answer 1

设置锚链接的样式可能会有些棘手。有几种伪类以及基本的a标签选择器可用于样式，这些样式会根据链接的状态影响链接。

/* newly added in the CSS selectors Level 4 specification */
:any-link, p :any-link{
  color:black;
}

/* it is recommended to always have the pseudo classes it in this order */
:link{
  color:blue;
}
:visited{
  color:mediumvioletred;
}
:hover{
  color:mediumaquamarine;
}
:active{
  color:green;
}

/* lowest specificity, so it will not be applied */
a{
  color:green;
}

<div><a href="#">This link starts out blue.</a></div>
<div><a href="https://www.google.com/">This link *might* be violetred in your browser.</a></div>
<div><a href="https://www.facebook.com/">So might this.</a></div>
<div class="special"><a href="#">Hovering will turn the links aquamarine.</a></div>
<p><a href="#">This link is black in browsers that support the new pseudo class. It also won't have any hover effects.</a></p>

如果您曾经在Chrome浏览器（而非Opera）上访问过代码段中的链接之一，则其颜色会有所不同。

我提供的代码段中的链接中，最有可能的一两个链接已经为您提供了不同的颜色，因为您过去访问过其中一个站点。

要获得一致的结果，请显式设置:link和:visited并注意selector specificity。

您可以使用:any-link来获得一致的结果，该结果实际上与:link,:visited相同，但是请记住，并非所有浏览器都支持这种较新的伪类，并且具有相同的基本特性，因此必须将其声明为 last （这就是代码段中的规则仅应用于最后一个链接的原因。

'a：link {color}'CSS选择器

1 个答案: