CSS 커서 URL 사용 형식에 대한 자세한 설명

css 커서 URL 사용 형식: css:{cursor:url('icon path'),auto;} //IE, FF, Chrome 브라우저 사용 가능

예제 코드: html{cursor: url("http://ued.taobao.com/blog/wp-content/themes/taobaoued/images/cursor.ico"),auto;}

분석: 이전 URL은 사용자 정의 마우스 아이콘 경로이고, 두 번째 매개변수 auto는 CSS 표준 커서 스타일로, 다른 속성(예: 포인터/기본값 등)으로 대체될 수 있습니다. !
(참고: w3school에서는 URL로 정의된 사용 가능한 커서가 백업이 되는 경우 두 번째 매개변수가 공통 커서를 정의해야 한다고 권장합니다! 또한 IE에서는 두 번째 매개변수가 생략될 수 있습니다.)

마우스 표시 아이콘을 사용자 정의하려면 다음 사항에 주의해야 합니다

아이콘 형식:

IE는 cur, ani, ico 형식을 지원합니다. FF는 bmp, gif, jpg, cur, ico 형식을 지원하므로 일반적으로 ani 형식이나 gif 애니메이션 형식을 지원하지 않는 것이 좋습니다. ico 또는 cur 형식의 URL이 참조하는 이미지입니다!

아이콘 크기:

마우스 이미지의 권장 크기는 32*32입니다. 그렇지 않으면 아이콘 크기가 일관되지 않을 수 있습니다!

또한 마우스 이미지가 브라우저에 표시되지 않는 문제는 대부분 마우스 이미지의 URL 경로 참조에 있습니다. 각각 절대 경로 참조와 상대 경로 참조를 시도해 볼 수 있습니다.

마지막으로 커서 속성의 가능한 값이 첨부됩니다. (모든 주요 브라우저는 다음 커서 속성을 지원합니다)

값 설명 URL

值	描述
url	需使用的自定义光标的 URL。 注释：请在此列表的末端始终定义一种普通的光标，以防没有由 URL 定义的可用光标。
default	默认光标（通常是一个箭头）
auto	默认。浏览器设置的光标。
crosshair	光标呈现为十字线。
pointer	光标呈现为指示链接的指针（一只手）
move	此光标指示某对象可被移动。
e-resize	此光标指示矩形框的边缘可被向右（东）移动。
ne-resize	此光标指示矩形框的边缘可被向上及向右移动（北/东）。
nw-resize	此光标指示矩形框的边缘可被向上及向左移动（北/西）。
n-resize	此光标指示矩形框的边缘可被向上（北）移动。
se-resize	此光标指示矩形框的边缘可被向下及向右移动（南/东）。
sw-resize	此光标指示矩形框的边缘可被向下及向左移动（南/西）。
s-resize	此光标指示矩形框的边缘可被向下移动（北/西）。
w-resize	此光标指示矩形框的边缘可被向左移动（西）。
text	此光标指示文本。
wait	此光标指示程序正忙（通常是一只表或沙漏）。
help	此光标指示可用的帮助（通常是一个问号或一个气球）。

사용할 커스텀 커서의 URL입니다.

참고: URL로 정의된 사용 가능한 커서가 없는 경우 항상 이 목록 끝에 일반 커서를 정의하십시오.

기본값 기본 커서(보통 화살표) 자동 기본값. 브라우저가 설정한 커서입니다. 십자선 커서는 십자선으로 렌더링됩니다. 포인터 커서는 링크를 나타내는 포인터(손)로 나타납니다 이동 이 커서는 개체를 이동할 수 있음을 나타냅니다. 전자 크기 조정 이 커서는 직사각형 상자의 가장자리를 오른쪽(동쪽)으로 이동할 수 있음을 나타냅니다. 크기 조정 이 커서는 직사각형 상자의 가장자리를 위쪽 및 오른쪽(북쪽/동쪽)으로 이동할 수 있음을 나타냅니다. nw-크기 조정 이 커서는 직사각형의 가장자리를 위쪽 및 왼쪽(북쪽/서쪽)으로 이동할 수 있음을 나타냅니다. n-크기 조정 이 커서는 직사각형 상자의 가장자리를 위쪽(북쪽)으로 이동할 수 있음을 나타냅니다. se-크기 조정 이 커서는 직사각형의 가장자리를 오른쪽(남쪽/동쪽) 아래로 이동할 수 있음을 나타냅니다. sw-크기 조정 이 커서는 직사각형의 가장자리가 아래쪽 및 왼쪽(남쪽/서쪽)으로 이동할 수 있음을 나타냅니다. s-크기 조정 이 커서는 직사각형 상자의 가장자리가 아래쪽(북쪽/서쪽)으로 이동할 수 있음을 나타냅니다. w-크기 조정 이 커서는 직사각형 상자의 가장자리를 왼쪽(서쪽)으로 이동할 수 있음을 나타냅니다. 텍스트 이 커서는 텍스트를 나타냅니다. 기다려 이 커서는 프로그램이 사용 중임을 나타냅니다(일반적으로 시계 또는 모래시계). 도움말 이 커서는 사용 가능한 도움말(일반적으로 물음표 또는 풍선)을 나타냅니다.