>  기사  >  웹 프론트엔드  >  CSS에서 마우스 스타일을 변경하는 방법

CSS에서 마우스 스타일을 변경하는 방법

藏色散人
藏色散人원래의
2018-12-03 14:33:353948검색



일반적인 마우스 스타일은 화살표 또는 작은 손 모양입니다. 또한 CSS의 커서 속성을 사용하여 자체 요구 사항에 따라 마우스 커서의 모양을 변경할 수 있습니다.

CSS에서 마우스 스타일을 변경하는 방법

추천 학습: "CSS Tutorial"

이제 마우스 커서의 다양한 스타일을 소개하겠습니다.

코드는 다음과 같습니다.

<!DOCTYPE>
<html>
<meta charset="utf-8">
<head>
    <title></title>
</head>
<body>
<a href=# style=cursor:crosshair;>十字准线</a><hr>
<a href=# style=cursor:text;> text </a><hr>
<a href=# style=cursor:wait;>等待的形状</a><hr>
<a href=# style=cursor:move;>移动的形状</a><hr>
<a href=# style=cursor:help;>帮助的形状</a><hr>
<a href=# style=cursor:default;>默认的形状</a><hr>
<a href=# style=cursor:hand;>小手状</a>
</body>
</html>

테스트를 위해 위 코드를 로컬로 복사하면 각 하이퍼링크 위에 마우스를 올리면 다양한 커서 스타일이 표시되고 변경됩니다.

십자선 스타일:


CSS에서 마우스 스타일을 변경하는 방법

텍스트 편집 시 스타일:

CSS에서 마우스 스타일을 변경하는 방법

대기 스타일:

CSS에서 마우스 스타일을 변경하는 방법

모바일 스타일:

CSS에서 마우스 스타일을 변경하는 방법

도움말 스타일:

CSS에서 마우스 스타일을 변경하는 방법

기본 화살표 스타일:

CSS에서 마우스 스타일을 변경하는 방법

손 스타일:

CSS에서 마우스 스타일을 변경하는 방법

커서 속성은 표시할 커서의 유형(모양)을 지정합니다. 이 속성은 마우스 포인터가 요소의 경계 내에 위치할 때 사용되는 커서 모양을 정의합니다(CSS2.1은 이 범위를 결정하는 경계를 정의하지 않지만).

이 글은 CSS 마우스 커서 스타일에 대한 간략한 소개입니다. 도움이 필요한 친구들에게 도움이 되길 바랍니다!



위 내용은 CSS에서 마우스 스타일을 변경하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.