可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):

问题:

Is there any reason why this does not work on Internet Explorer or Chrome:

<html>
    <head>
        <style>
            A {font-weight: bold; color:black;}
            A:visited {font-weight: normal; color: black; }
            .Empty {font-weight: bold; color: black; }
        </style>
    </head>

    <body>
        <a href="http://mysite">click me</a>
    </body>
</html>

The link I click never goes to normal and just stays bold. On some other browsers it works.

Edit: changing case did not affect it.

Edit: changing a to a:link did not affect it.

Edit: changing color works, just not font-weight.

Edit: workaround was to change accessibility to ignore web colors. I do not have access to the source, so I had to do it this way.

回答1:

Actually, this has nothing to do with case sensitivity. This is a security feature. The functionality of :visited pseudoclass has been restricted in many modern browsers (Fx4, IE9, Chrome) to prevent CSS exploit: read about it here.

Nowadays, getComputedStyle() in these browsers usually returns values for visited links as if they weren't visited. However, I can simply imagine circumventing of that: using font-weight for visited links, the element's width changes so browsers that would allow changing font-weight for :visited links wouldn't actually fix the security hole.

Thus, there's no workaround for this issue.

回答2:

CSS itself is not case-sensitive, but if the HTML file using this style has an XML declaration and an XHTML doctype, that CSS is not going to work, because tags are case-sensitive. You'll have to set the "a" tags to lower-case.

Explained here: http://reference.sitepoint.com/css/casesensitivity

回答3:

Perhaps try changing the color attribute and see whether that has an effect at all.

To troubleshoot, you might want to try to utilize the developer tools in chrome to see what style is applied.

回答4:

You need to have separate declarations for a:link, a:visited, a:active, etc.

Remove your first style that does not contain a colon. It's overriding. Replace with a:link.

回答5:

I fixed this issue for my website by saving the links into a cookie or session and then manually add an visited class to my php navigation script. Just make a uri array like this:

//Script that loads on every page to save visited pages
$_COOKIE['uris'] = array ('uri/page1', 'uri/page2', 'uri/page3');

//The below script must reside on every navigation script
$uris = $_COOKIE['uris'];
if(in_array($link['uri'], $uris) {
  echo '<a class="visited" href="'.$link['uri'].'">'.$link['name'].'</a>';
} else {
  echo '<a href="'.$link['uri'].'">'.$link['name'].'</a>';
}

回答6:

The problem has to do with history sniffing, changing css properties is disabled for visited links due to privacy issues.

I came up with the following workaround to reach the desired effect. It is possible to change the background-color of the visited link.

The solution is very simple:

set a background-image on the link with the same height as your link and 1px width and repeat the image horizontally
the image has the same color as the background of the link
make one pixel of that image transparent, in the vertical middle
on :visited state just change the backgroundcolor of that link to the text-color of the link
Only one line of the background-color wil be visible, because the background-image is masking it

Here's an example:

a:link {
    color:#000;
    background:#FFF url('../img/linethrough.png') repeat-x top left;
}

a:visited {
    background-color:#000;
    color:#000;
}

Why doesn't this a:visited css style work?

问题:

回答1:

回答2:

回答3:

回答4:

回答5:

回答6:

收藏的人(0)

Why doesn't this a:visited css style work?

问题:

回答1:

回答2:

回答3:

回答4:

回答5:

回答6:

收藏的人(0)

举报内容

检举类型

检举原因

检举说明(必填)

打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮