>  기사  >  웹 프론트엔드  >  href 없이 링크 포인터에 커서 스타일을 설정하는 방법은 무엇입니까?

href 없이 링크 포인터에 커서 스타일을 설정하는 방법은 무엇입니까?

王林
王林앞으로
2023-08-24 12:13:02603검색

如何将光标样式设置为没有 href 的链接的指针?

HTML에서 태그를 사용하여 웹 페이지에 링크를 추가할 수 있습니다. 요소의 기본 커서 스타일은 포인터이지만 태그에서 href 속성을 제거하면 커서 스타일이 변경됩니다.

그래서 이 튜토리얼에서는 커서 스타일을 href 속성 없이 표시된 포인터로 유지하는 방법을 배웁니다.

사용자는 아래 예를 따라 요소

의 기본 커서 스타일을 볼 수 있습니다.

아래 예에서는 태그를 사용하여 세 가지 다른 링크를 만듭니다.

출력에서 첫 번째 링크 위로 마우스를 가져가면 두 번째 링크에 대한 href 속성이 포함되어 있기 때문에 커서가 포인터가 되는 것을 볼 수 있습니다. 빈 문자열 값이고 세 번째 링크 위로 마우스를 가져가면 href 속성이 포함되어 있지 않기 때문에 커서 스타일이 변경됩니다.

으아악

이제 사용자는 태그에서 href 속성을 제거할 때 커서 스타일이 어떻게 변경되는지 이해합니다.

아래에서는 href 속성이 없는 링크에 대해 커서 포인터를 설정하는 예를 살펴보겠습니다.

문법

사용자는 아래 구문을 따르고 CSS를 사용하여 href 속성이 없는 링크에 커서 포인터를 설정할 수 있습니다.

으아악

위 구문에서 "포인터"는 요소에 할당된 클래스이며 "포인터" 클래스를 포함하는 요소의 포인터 스타일을 변경합니다.

아래 예에서는 두 개의 서로 다른 요소를 만들고 "포인터" 클래스를 두 요소에 할당합니다. 섹션에서 페이지에 인라인 스타일을 추가했습니다.

으아악

아래 예에서는 예 2와 같이 포인터에 대한 href 속성 없이 요소의 커서 스타일을 지정하기 위해 "cursor:pointer" 스타일을 사용했지만 인라인 CSS를 태그에 적용했습니다. .

으아악

아래 예에서는 "onmouseover" 이벤트 속성을 사용합니다. 마우스 포인터가 마커 위로 이동할 때마다 해당 마커에 할당된 콜백 함수가 호출됩니다. 여기서는 콜백 함수를 할당하는 대신 CSS 한 줄을 할당합니다.

따라서 사용자가 href 속성이 없는 태그 위로 마우스를 가져갈 때마다 커서 스타일이 포인터로 설정됩니다.

으아악

아래 예에서는 href 속성과 함께 태그를 사용했지만 href 속성 값으로 빈 문자열을 할당했습니다. 따라서 자동으로 null 링크로 작동하고 태그에 대한 커서 포인터를 설정합니다.

으아악

이 튜토리얼에서는 href 속성 없이 링크에서 커서를 포인터로 스타일 지정하는 방법을 배웠습니다. CSS를 사용하여 커서 스타일을 변경합니다. 또한 onmouseover 이벤트 속성을 사용하여 마우스 오버 이벤트를 감지하고 그에 따라 커서 스타일을 변경합니다.

위 내용은 href 없이 링크 포인터에 커서 스타일을 설정하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 tutorialspoint.com에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제