programing

하이퍼링크에서 모든 스타일/형식 제거

codeshow 2023. 10. 29. 20:03
반응형

하이퍼링크에서 모든 스타일/형식 제거

색이 다른 단어로 탐색 메뉴를 만들고 있습니다 (href링크).어떤 상태(호버, 방문 등)에서도 색상이 변하지 않았으면 좋겠습니다.

상태별로 색상을 설정하는 방법은 알고 있지만, 텍스트 색상(및 기타 스타일링/포맷)은 그대로 두도록 코드를 알고 싶습니다.

좋은 의견이라도 있나?

간단히 링크에 대한 스타일을 정의할 수 있습니다. 이 스타일은 다음을 재정의합니다.a:hover,a:visited등:

a {
  color: blue;
  text-decoration: none; /* no underline */
}

사용할 수도 있습니다.inherit대신 부모 스타일의 속성을 사용하려면 value:

body {
  color: blue;
}
a {
  color: inherit; /* blue colors for links too */
  text-decoration: inherit; /* no underline */
}

속성-값 쌍:

a {
    all: unset;
}

제 생각에는 더 깨끗해 보이고 모든 셀렉터와 함께 작업할 수 있는 장점이 있습니다. 예를 들어:

a, button /* &c... */ {
    all: unset;
}

이렇게 하면 해당 속성도 제거됩니다.{cursor: pointer;}당신의 링크에서.그것은 당신이 찾고 있는 것일 수도 있고 그렇지 않을 수도 있습니다.두 번째 경우에 이 속성을 추가하기만 하면 됩니다.

자세한 내용은 다음과 같습니다.all속기, 이 페이지를 확인하세요: https://developer.mozilla.org/en-US/docs/Web/CSS/all
Emmi가 말했듯이 호환성을 확인하는 것을 잊지 마세요: https://caniuse.com/css-all

크리스가 내 앞에서 말한 것처럼, 그냥.a오버라이드해야 합니다.예를 들어,

a { color:red; }
a:hover { color:blue; }
.nav a { color:green; }

이 경우에는.nav a항상 녹색일 것입니다.:hover적용되지 않을 겁니다

만약 다른 규칙이 영향을 준다면, 당신은!important, 하지만 하지 말아야 합니다.빠져드는 것은 나쁜 습관입니다.

.nav a { color:green !important; } /*I'm a bad person and shouldn't use !important */

그러면 다른 규칙과 상관없이 항상 초록색이 될 겁니다.

그냥 사용하시면 됩니다.a스타일시트의 Selector를 선택하여 앵커/hyperlink의 모든 상태를 정의합니다.예를 들어,

a {
    color: blue;
}

모든 링크 스타일을 무시하고 모든 주를 파란색으로 만듭니다.

말씀드리면a.redLink{color:red;}그 다음에는 이것을 호버링하고 추가합니다.a.redLink:hover{color:red;}이렇게 하면 다른 호버 상태에서 링크의 색이 변경되지 않습니다.

언급URL : https://stackoverflow.com/questions/8919682/remove-all-styling-formatting-from-hyperlinks

반응형