У меня есть код ссылки html anchor link, и, в отличие от остального документа, я хочу, чтобы он выглядел так, как будто это не ссылка.
Есть ли простой способ отключить изменение стиля, вызванное переносом текста в тег привязки, без необходимости принудительно использовать его для одного и того же (т.е. если я изменяю стиль шрифта тела, мне также не нужно изменять некоторые other: link).
Установка цвета в черный и текстовое оформление явно не является чем-то более агрессивным, чем работало для меня.
Я искал CSS якоря, чтобы быть "доброкачественным" и просто вписываться в существующий CSS. Вот с чем я пошел:
a.nostyle:link {
text-decoration: inherit;
color: inherit;
cursor: auto;
}
a.nostyle:visited {
text-decoration: inherit;
color: inherit;
cursor: auto;
}
Затем я просто добавил класс nostyle CSS к якорям, которые я хотел бы отформатировать.
Если вам неинтересно IE, вы можете прикрепить :not(#exclude) (где exclude - идентификатор соответствующей ссылки) к стилям ссылок:
a:link:not(#exclude), a:visited:not(#exclude) {
text-decoration: none;
color: blue;
cursor: pointer;
}
В противном случае я не думаю, что вы можете использовать ее так, как вы описываете. Вместо этого вы можете использовать встроенный стиль (не рекомендуется), или вы можете использовать специальный класс/идентификатор, назначенный этой ссылке, селектор которого вы бы группировали с помощью body. Например, если у вас есть эти стили:
body {
text-decoration: none;
color: black;
cursor: auto;
}
a:link, a:visited {
text-decoration: none;
color: blue;
cursor: pointer;
}
Вы можете просто вставить более конкретный селектор, соответствующий этой ссылке, в правило body:
body, #exclude {
text-decoration: none;
color: black;
cursor: auto;
}
a:link, a:visited {
text-decoration: none;
color: blue;
cursor: pointer;
}
Я достиг этого, создав класс .reset-a и нацелив все его псевдо-классы.
Таргетирование всех псевдо классов важно, чтобы сделать его безупречным.
outline: 0 свойство удаляет пунктирную границу, которая окружает ссылку, когда она сфокусирована или активна.
.reset-a, .reset-a:hover, .reset-a:visited, .reset-a:focus, .reset-a:active {
text-decoration: none;
color: inherit;
outline: 0;
cursor: auto;
}