programing tip

href가없는 링크의 포인터로 커서 스타일을 설정하는 방법

itbloger 2020. 7. 7. 07:53
반응형

href가없는 링크의 포인터로 커서 스타일을 설정하는 방법


자바 스크립트 호출을 위한 속성이 <a>없는 많은 HTML 태그 가 있습니다. 이 링크에는 포인터 스타일의 커서가 없습니다. 텍스트 스타일 커서가 있습니다.hrefonclick

href속성 을 사용하지 않고 커서 스타일을 링크 포인터로 설정하려면 어떻게 해야합니까?

href = "#"을 추가 할 수 있다는 것을 알고 있습니다. 나는 이것을 HTML 문서의 많은 곳에서 가지고 있으며 href속성 을 사용하지 않고 링크에 대한 커서 스타일 포인터를 만드는 방법을 알고 싶습니다 .


CSS 파일에 이것을 추가하십시오 ....

a:hover {
 cursor:pointer;
}

CSS 파일이 없으면 HTML 페이지의 HEAD에 추가하십시오.

<style type="text/css">
 a:hover {
  cursor:pointer;
 }
</style>

또한 자바 스크립트 끝에서 false를 반환하여 href = ""속성을 사용할 수 있습니다.

<a href="" onclick="doSomething(); return false;">a link</a>

이것은 여러 가지 이유로 좋습니다. SEO 또는 사람들이 자바 스크립트가없는 경우 href = ""가 작동합니다. 예 :

<a href="nojavascriptpage.html" onclick="doSomething(); return false;">a link</a>

@ 참조 http://www.alistapart.com/articles/behavioralseparation

편집 : BalusC의 @ 주목할 필요가 대답 그가 언급 :hover영업의 사용 사례에 대한 필요가 없습니다. 다른 스타일은 :hover선택기 로 추가 할 수 있습니다 .


이것을 전역 CSS 스타일에 추가하십시오.

a { cursor: pointer; }

이렇게하면 더 이상 브라우저 기본 커서 스타일에 의존하지 않습니다.


style = "cursor : pointer;"


주어진 object(myObject) 위로 마우스를 가져갈 때 커서를 화살표에서 손으로 변경하는 방법 입니다.

myObject.style.cursor = 'pointer';

그들에게 공통 클래스를 제공하십시오 (예 : 링크). 그런 다음 CSS 파일을 추가하십시오.

.link { cursor: pointer; }

또는 @mxmissile이 제안한 것처럼 style = "cursor : pointer;"


다음 CSS를 사용하여 클래스를 만들고 onclick 이벤트를 사용하여 태그에 추가하십시오.

cursor:pointer;

cursor: pointer올바르게 기억 하면 CSS를 사용하십시오 .

CSS 파일에서

.link_cursor
{
    cursor: pointer;
}

그런 다음 링크 커서를 가지려는 요소에 다음 HTML을 추가하십시오 class="link_cursor".

또는 인라인 CSS를 사용하십시오.

<a style="cursor: pointer;">

참고 URL : https://stackoverflow.com/questions/2409836/how-to-set-cursor-style-to-pointer-for-links-without-hrefs

반응형