html 하이퍼링크 'a' 태그의 기본 링크 색상을 제거하려면 어떻게 해야 합니까?

html 하이퍼링크 'a' 태그의 기본 링크 색상을 제거하려면 어떻게 해야 합니까?

기본 링크 색상은 파란색입니다.HTML 하이퍼링크 태그의 기본 링크 색을 제거하려면 어떻게 해야 합니까?<a>?

상속 값:

a { color: inherit; } 

… 요소가 부모의 색을 띠게 됩니다(제 생각에 당신이 찾고 있는 것입니다).

라이브 데모는 다음과 같습니다.

a {
  color: inherit;
}

<p>The default color of the html element is black. The default colour of the body and of a paragraph is inherited. This
  <a href="http://example.com">link</a> would normally take on the default link or visited color, but has been styled to inherit the color from the paragraph.</p>

다음과 같은 것을 시도해 보십시오.

a {
    color: #0060B6;
    text-decoration: none;
}

a:hover {
    color:#00A0C6; 
    text-decoration:none; 
    cursor:pointer;  
}

한다면text-decoration작동하지 않습니다. 다음으로 변경하십시오.

text-decoration: none !important;

그!important규칙은 다른 모든 스타일링을 덮어씁니다.text-decoration기여하다.자세한 내용은 여기서 확인하실 수 있습니다.

브라우저에서 제공하는 밑줄과 기본 색상을 표시하지 않으려면 메인.css 파일 상단에 다음 코드를 유지할 수 있습니다.다른 색상과 장식 스타일이 필요한 경우 아래 코드 조각을 사용하여 기본값을 쉽게 재정의할 수 있습니다.

 a, a:hover, a:focus, a:active {
      text-decoration: none;
      color: inherit;
 }

.cancela,.cancela:link,.cancela:visited,.cancela:hover,.cancela:focus,.cancela:active{
    color: inherit;
    text-decoration: none;
}

저는 위의 클래스 정의를 게시할 필요가 있다고 느꼈습니다. SO에 대한 많은 답변이 일부 주를 빗나갔습니다.

이 또한 가능합니다.

a {
  all: unset;
}

unset: 이 키워드는 요소 또는 요소의 상위에 적용되는 모든 속성을 상속 가능한 경우 상위 값으로 변경하고 그렇지 않은 경우 초기 값으로 변경함을 나타냅니다.unicode-bidi 및 방향 값은 영향을 받지 않습니다.

출처 : Mozilla description of all

이 내용을 추가하기만 하면 됩니다.CSS,

a {
    color: inherit;
    text-decoration: none;
}

됐습니다, 됐습니다.

사용해야 합니다.CSS. 다음은 링크가 그냥 있을 때, 호빙되고 있을 때, 활성 링크일 때 기본 링크 색상을 변경하는 예입니다.

a:link {
  color: red;
}

a:hover {
  color: blue;
}

a:active {
  color: green;
}

<a href='http://google.com'>Google</a>

CSS 2.0과 함께 도입되었으나 CSS 3에서는 사용하지 않는 시스템 컬러(18.2) 값을 사용할 수 있습니다.

a:link, a:hover, a:active { color: WindowText; }

이렇게 하면 앵커 링크는 시스템의 일반 문서 텍스트와 같은 색을 갖게 됩니다.

부트스트랩 4를 사용하여 Rails 6 애플리케이션을 작업할 때 이 문제가 있었습니다.

저의 과제는 이 스타일링이 애플리케이션의 기본 링크 스타일링을 무시하는 것을 원하지 않는다는 것이었습니다.

그래서 저는 CSS 파일을 만들었습니다.custom.css아니면custom.scss.

그런 다음 다음과 같은 속성을 가진 새로운 CSS 규칙을 정의했습니다.

.remove_link_colour {
  a, a:hover, a:focus, a:active {
      color: inherit;
      text-decoration: none;
  }
}

그런 다음 기본 링크 스타일을 무시하기 위해 필요한 곳마다 이 규칙을 호출했습니다.

<div class="product-card__buttons">
  <button class="btn btn-success remove_link_colour" type="button"><%= link_to 'Edit', edit_product_path(product) %></button>
  <button class="btn btn-danger remove_link_colour" type="button"><%= link_to 'Destroy', product, method: :delete, data: { confirm: 'Are you sure?' } %></button>
</div>

이를 통해 기본 링크 스타일링을 재정의하는 문제를 해결하고 CSS 규칙을 호출하는 곳에서만 버튼의 기본 색상, 호버, 포커스 및 활성 스타일링을 제거할 수 있습니다.

그게 전부입니다.

이게 도움이 됐으면 좋겠습니다.

a:link{color:inherit;}

이것은 당신을 위해 모든 것을 할 수 있는 간단한 한 줄입니다 <3.

저도 태그의 기본 파란색 링크 색상을 제거하고 싶었습니다.부트스트랩 버전 5를 사용하면서 부트스트랩 설명서에서 해결책을 찾기로 했습니다."link color"를 검색해보니 결과는 다음 링크였습니다: "https://getbootstrap.com/docs/5.0/helpers/colored-links/ "

부트스트랩 버전 5.0에는 링크 색상을 커스터마이징 할 수 있는 클래스가 있는데, 매우 도움이 되었다고 생각했고, 또한 'a' 태그의 기본 파란색을 아무런 소란 없이 변경할 수 있었습니다.

이것이 도움이 되기를 바랍니다.

기본 링크 색을 제거하는 두 가지 방법은 다음과 같습니다.

방법 1: 인라인 CSS 사용하기

<a href="https://example.com" style="color: black;">Link Text</a> 

방법 2: CSS 스타일시트 사용하기

a {
  color: black;
}

<style>
a {
color:      ;
}
</style>

이 코드는 색상을 기본값에서 스타일에 지정된 것으로 변경합니다.호버를 사용하면 호버의 기본값에서 텍스트의 색상을 변경할 수 있습니다.

잘 될 겁니다.

    a:hover, a:focus, a:active {
        outline: none;
    }

이렇게 하면 세 개의 유사 클래스에 대한 윤곽이 모두 제거됩니다.

언급URL : https://stackoverflow.com/questions/6722467/how-do-i-remove-the-default-link-color-of-the-html-hyperlink-a-tag