Подтвердить что ты не робот

Установите посещенный цвет ссылки на любой цвет недоступной ссылки (P.S. не обычный вопрос)

Мне нужно установить a: visited CSS для любого цвета, для которого установлен нормальный a.

То, что я хочу сообщить браузеру, для посещенных ссылок использует тот же цвет, что и невидимые ссылки, независимо от того, какой цвет он имеет.

Мне нужно сделать это без указания определенного цвета.

Например, если появляется какой-то странный браузер, который использует "зеленый цвет" в качестве цвета для обычных невидимых ссылок, этот CSS должен указывать браузеру использовать тот же самый зеленый цвет для посещенных ссылок. Точно, какой цвет используется браузером, должен быть прозрачным для моего кода.. отсюда фраза "любой цвет".

P.S. Я знаю, как установить: посещенный и определенный цвет. Это не то, о чем я прошу.

P.P.S. Я готов использовать JavaScript, если нужно. Но я действительно стараюсь сделать это браузером.

Почему я хочу делать что-то подобное, о чем вы спрашиваете?

Синий цвет, который IE8 использует для ссылок, довольно круто. Это не # 0000FF. Это красивый оттенок синего. Поэтому я хочу установить его как для посещенных, так и для не связанных ссылок. Но я не должен делать снимок экрана или использовать некоторое дополнение, чтобы каждый раз выбирать точное значение шестнадцатеричного значения. Если IE позже изменит цвет на какой-либо другой удивительный оттенок, этот код должен работать. Я не хочу снова найти шестнадцатеричный код и изменить его по всему моему коду.

Это только одна причина. Не давайте мне гексагона для этого синего. Найти это легко, но это не будет ответом!

4b9b3361

Ответ 1

a:link{color:inherit}
a:active{color:inherit}
a:visited{color:inherit}
a:hover{color:inherit}

Ад да.

Мне это нужно, потому что некоторые текстовые ссылки (в отличие от ссылок на изображения) были основной частью главного меню моего проекта, поэтому я хочу, чтобы они отображали мои цвета, а не цвета браузера!

Каждая ссылка была заключена в группу p-тегов, класс которой имел определенный цвет (MY color), установленный в CSS.

Ответ 2

Danny Robers script работает для меня в Firefox и Chrome (не уверен в IE).

FWIW, специальное значение HyperlinkText было бы "стандартным" способом делать то, что вы хотите, но оно было удалено из CSS3 когда-то в spring 2003.

Похоже, что Firefox - единственный браузер, который начал его реализовывать, потому что для Firefox работает следующее:

a: visited {color: -moz-hyperlinktext; }

Ответ 3

Я не думаю, что есть чистое решение CSS. Обычно вы выбираете цвет и устанавливаете как: link, так и: посетили тот же цвет.

Я пробовал {color: inherit}, но это было бесполезно.

Это решение jQuery отлично работает.

<!DOCTYPE html>
<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"
            type="text/javascript"></script>
        <script type="text/javascript">
            $(function(){
                var normalColor = $('a:link').css('color');
                $('a:visited').css('color', normalColor);
            });
        </script>
    </head>
    <body>
        <a href="http://www.google.com">Google</a>
        <a href="nowhereyouvebeen">No where you've been</a>
    </body>
</html>

Ответ 4

Нет способа сделать это с помощью CSS. Браузер указывает, что ссылка была посещена на основе записи базы данных, о которой она знает, а затем использует цвета по умолчанию, указанные в конкретной конфигурации браузеров.

CSS физически просто не может получить цвет чего-либо на странице. Так оно и есть. Единственный способ - использовать javascript, как ответ Дэнни Робертса.


Причина, по которой я думаю, что его ответ работает некорректно, заключается в том, что $('a:visited') просто выбирает все посещенные ссылки в этот момент времени, а затем цвет меняется для них.

Что вам нужно сделать, это следить за событиями щелчка и повторно запускать код каждый раз:

var normalColor = $('a:link').css('color');
$('a').click(function() {
    $('a:visited').css('color', normalColor);
});

Ответ 5

Не обращай внимания на это. См. Мой другой ответ на что-то более конкретное, относящееся к заданному вопросу.

Я делаю это:

a, a:visited { color:#4CA1F6; }
a:hover      { color:#4CB6E1; } a:active  { color:#0055AA; }

Теперь, когда этот поток заставляет меня думать,, и я сделал следующие улучшения для моего метода:

a:link, a:visited { color:#4CA1F6; }
a:hover, a:focus  { color:#4CB6E1; } 
a:active          { color:#0055AA; }

Ответ 6

Я не думаю, что для этого есть чистый способ CSS. Я думаю, вам нужно будет использовать JavaScript, чтобы получить цвет a, а затем установить: посетили этот цвет, и это, вероятно, не будет работать во всех браузерах, если не указан параметр {color: #dea}.

Ответ 7

Presto:

$(function(){
  var sheet = document.styleSheets[document.styleSheets.length-1];
  sheet.insertRule(
    'a:visited { color:'+$('a:link').css('color')+'; }',
    sheet.length
   );
});

Я тестировал и подтверждаю, что это работает в Chrome. Имейте в виду, однако, что sheet вы добавляете правила, чтобы убедиться, что его атрибут относится к интересующему вас медиа. Кроме того, если у вас есть какие-либо правила, которые переопределяют окраску a, это, вероятно, не сработает должным образом, поэтому убедитесь, что ваши таблицы стилей не соответствуют этому.

Я не уверен, что это очень мудрая практика. Лично я всегда четко определяю свои цвета ссылок для каждого сайта.

PS:

Очевидно, что IE (не знаю, какие версии) настаивает на своем синтаксисе:

sheet.addRule('a:visited', $('a:link').css('color'), -1);

Ответ 8

 a:link, a:visited {color: inherit;}
 a:hover, a:focus {color:inherit;}

Ответ 9

Мне нужно решение, которое нужно сделать, поскольку заголовок этого вопроса предполагает "Установить посещенный цвет ссылки на любой цвет ссылки, не посещенной". Для меня мне был нужен способ сравнения изображений, которые я использую для тестирования регрессии (pdiff - perceptual diff). Вот код, который работал у меня.

(function(){
  var links = document.querySelectorAll('a');
  for (var i=0; i<links.length; i++) {
    var link = links[i];
    if (link.href) { //must be visitable
      var rules = window.getMatchedCSSRules(link) || [];
      var color = '#0000EE' //most browsers default a:link color;
      for (var j=0; j<rules.length; j++) {
        var rule = rules[j];
        var selector = rule.selectorText;
        color = rule.style['color'] || color;
      }
      link.setAttribute('style','color:' + color + ' !important');
      //this was enough for me but you could add a 'a:visited' style rule to the rule set
    }
  }
})();

Ответ 10

a.one:link {
    color:#996600;
    background-color:transparent; 
    text-decoration:underline;  
}

a.one:hover { 
    color: red;
    background-color: transparent;
    text-decoration: underline; 
}

a.one:visited {
    color: #996600;
    background-color: transparent;
    text-decoration: underline
}

a.one:hover { 
    color: red;
    background-color: transparent;
    text-decoration: underline; 
}