링크 내의 특정 요소에 밑줄을 긋지 않고 링크 스타일을 지정하는 방법은 무엇입니까?

특정 요소를 강조하지 않고 링크 스타일 지정

CSS로 링크 스타일을 지정할 때 링크 내 특정 요소의 밑줄을 제거하지 못하는 문제가 발생할 수 있습니다. . 예를 들어, 링크의 일부만 강조 표시하려는 경우 이는 실망스러울 수 있습니다.

문제 설명

제공된 코드 조각에서:

a {
  text-decoration: underline;
}

a #myspan {
  color: black;
  text-decoration: none;
}

목표는 ID가 #myspan인 요소를 제외한 모든 링크에 밑줄을 표시하는 것입니다. 그러나 text-design: none; 설정에도 불구하고; #myspan에서는 밑줄이 그어져 있습니다. 그 이유는 CSS 우선순위 규칙이 보다 구체적인 선택자(a #myspan)보다 상위 선택자(a)에 더 높은 우선순위를 부여하기 때문입니다. 따라서 a의 밑줄은 텍스트 장식을 재정의합니다. none; #myspan에 대한 규칙.

솔루션

이 문제를 해결하려면 #myspan의 표시 속성을 인라인 블록으로 변경할 수 있습니다.

a #myspan {
  color: black;
  display: inline-block;
}

#myspan을 만들어서 인라인 블록 요소인 경우 텍스트 장식과 관련된 요소와의 관계를 제거합니다. 이에 따라 #myspan에는 밑줄이 적용되지 않습니다.

위 내용은 링크 내의 특정 요소에 밑줄을 긋지 않고 링크 스타일을 지정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!