0

我找不到风格的方式,a:visited但只有那些属于.extern.

a:visited.extern不起作用,也不起作用a.extern:visited(我使用 Mozilla Firefox 43.0.1 for Linux x86_64)

原因是我有一个小图标要添加到.extern链接中,并且我想在url()访问链接时更改它。

<style>
    a.extern {
        padding-right:1.3em;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-position: right center;
        background-clip: border-box;
        background-origin: padding-box;
        background-size: 0.7em 0.7em;
        background-image: url("img/link.png");
    }

    a:visited:extern {
        background-image:url("img/link-visited.png");
    }

    a.extern:visited {
        background-image:url("img/link-visited.png");
    }
</style>

最后所有访问过的这种类型的链接都应该受到影响

<a class="extern" href="http://etc.etc.etc">link</a>
4

3 回答 3

3

基本上你想要做的是受到浏览器的限制,特别是 Firefox。

每个 MDN - 隐私和 :visited 选择器

您仍然可以对访问的链接进行可视化样式设置,但现在可以使用的样式受到限制。只有以下属性可以应用于访问的链接:

  • 颜色
  • 背景颜色
  • 边框颜色(及其子属性)
  • 轮廓颜色
  • 填充和描边属性的颜色部分
于 2016-01-16T14:20:52.413 回答
1

首先,我假设您的班级名称是extern,而不是.extern,因此您的a标签看起来像这样。

<a class="extern" href="http://etc.etc.etc">link</a>

要仅设置具有 extern 类的已访问链接的样式,您应该使用:

a.extern:visited {
    background-image:url("img/link-visited.png");
}

注意:visited选择器是如何添加到最后的:a.extern:visited.

于 2016-01-16T14:07:02.600 回答
0

改变

<a class=".extern" href="http://etc.etc.etc">link</a>

<a class="extern" href="http://etc.etc.etc">link</a>

<style>
    a.extern {
        padding-right:1.3em;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-position: right center;
        background-clip: border-box;
        background-origin: padding-box;
        background-size: 0.7em 0.7em;
        background-image: url("img/link.png");
    }

    a:visited:extern {
        background-image:url("img/link-visited.png");
    }

    a.extern:visited {
        background-image:url("img/link-visited.png");
    }
</style>

不需要下面的代码块

a:visited:extern {
    background-image:url("img/link-visited.png");
}
于 2016-01-16T14:08:20.147 回答