结合了:与受访:之后,或伪元素链接伪类(Combine a:visited with a:after

2019-06-28 01:47发布

比方说,我想下一次添加的形状(像勾号)的链接已被访问后,而不是有它只是变成紫色,使用:连同后:参观。

我不确定我是否应该选择这样的形状:

a:visited:after {

或者是这样的:

a:visited a:after

要么

a:visited :after {

(我也上时,我应该或不应该伪元素之前添加一个空格,或者它甚至关系有点模糊?)

或者是不同的东西?

现在我的CSS是这样的:

a:visited:after {
    /* check mark shape */
    content:'\00a0';
    color: black;
    position: relative;
    left:15px;
    display:inline-block;
    width: 3px;
    height: 6px;
    border: solid black;
    border-width: 0 2px 2px 0;  
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
}

从检查标记形状代码http://webitect.net/design/webdesign/creating-fancy-bullet-points-with-pure-css3/

谢谢你的帮助。

Answer 1:

你应该使用a:visited:after ,你目前工作。 它不正常工作,因为在你的代码中的错误,但由于问题在于:visited伪类-它不允许使用伪元素的,因为隐私问题 。

所以基本上,你将无法在您选中图标仅适用于访问过的链接。

对此:

(我也上时,我应该或不应该伪元素之前添加一个空格,或者它甚至关系有点模糊?)

它做的事情,因为空间代表的后代组合子:

  1. 选择a:visited a:after表示:after一种的伪元素a是的后代另一a它是一个访问过的链接,这在HTML没有引起太大的意义。

  2. 选择a:visited :after是类似a:visited a:after ,除非它代表:after 任何形式的后代的a:visited

    它可以被改写为a:visited *:after 。 请参阅通用选择在规范中。

由于省略了空间,你直接将伪元素被面前的选择,而你的情况是表示的元素a:visited ,没有任何后代。



文章来源: Combine a:visited with a:after, or chaining pseudo-classes with pseudo-elements