CSS를 사용하여 링크를 비활성화하려면 어떻게 해야 합니까?

링크를 비활성화하는 CSS 트릭

문제:

CSS를 사용하여 링크를 비활성화할 수 있습니까? 예를 들어, "현재 페이지"라는 클래스가 있는 경우 클릭 시 해당 클래스와의 링크가 활성화되지 않도록 할 수 있습니다.

해결책:

다음 CSS 코드 조각은 간단한 솔루션을 제공합니다.

[aria-current="page"] {
  pointer-events: none;
  cursor: default;
  text-decoration: none;
  color: black;
}

이 코드는 "aria-current='page'"가 있는 요소를 대상으로 합니다. 속성을 지정하고 "pointer-events"를 "none"으로 설정하여 상호 작용을 비활성화합니다. 또한 "커서"를 "기본값"으로 설정하고, 텍스트 장식을 제거하고, 텍스트 색상을 검은색으로 재설정하여 일반적인 링크 스타일을 제거합니다.

이 솔루션을 HTML에 적용하려면 다음과 같이 링크를 수정할 수 있습니다.

<a href="link.html" aria-current="page">Link</a>

이렇게 하면 링크가 비활성화되고 "현재 페이지" 클래스가 적용될 때 클릭할 수 없게 됩니다.

위 내용은 CSS를 사용하여 링크를 비활성화하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!