Как изменить размер шрифта в css?

Question

В моем приложении мне нужно изменить размер шрифта посещенных ссылок. Что я делаю:

a:visited { 
    color: pink; 
    font-size:12px; 
} 

Но меняется только цвет. Почему размер шрифта не меняется?

Answer 1

Ограничения :visited

:visited pseudoselector имеет some limitations в отношении того, что свойства он может предназначаться и, к сожалению font-size не один из них:

Приемлемые свойства

Как видно выше, единственно приемлемыми стили, которые могут быть направлены являются:

• color
• background-color
• border-color
• border-{bottom,left,right,top}-color
• outline-color
• column-rule-color

Это сделано по соображениям безопасности/конфиденциальности и вряд ли изменится в ближайшее время. Если вам действительно нужно было это реализовать, вам, скорее всего, придется прибегнуть к некоторому Javascript, чтобы явно установить размер в ваших посещенных тегах.

Answer 2

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

Допустимые типы:

• цвет
• цвет фона
• границы цвета (и границы цвета для отдельных сторон)
• обводки
• колонного правило цвета
• цветные части заливки и обводки

Все остальные стили наследуются по ссылке:.

Answer 3

Вы можете изменить любой цвет посещенных (: посещенных) ссылок, но не размер. Вы можете изменить размер: link {font-size: 150%} посещенных ссылок «NOT»

Answer 4

Итак, все остальные ответы установили, что это невозможно сделать с помощью чистого CSS. Так что JavaScript на помощь.

https://jsfiddle.net/dustinpoissant/708fwntf/

$(function(){ 
 
    $("a").each(function(index, link){ 
 
    var $link = $(link); 
 
    console.log($link.css("color")); 
 
    if($link.css("color") == "rgb(0, 0, 238)"){ 
 
     $link.addClass("visited"); 
 
    } 
 
    }) 
 
});

a:visited { 
 
    color: pink; 
 
} 
 
a.visited { 
 
    font-size: 26px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a href="#">Test</a>