CSS의 커서 속성을 설정하는 방법

많은 친구들이 CSS의 커서속성을 설정하는 방법에 대해 잘 알지 못합니다. 오늘은 커서 속성에 대한 이해를 돕기 위해 커서 속성과 해당 구문 및 간단한 예를 소개하겠습니다.

DIV CSS를 레이아웃할 때 마우스 포인터가 손가락 모양으로 바뀌거나 다른 스타일로 바뀌는 등 개체 내에서 마우스 포인터 커서를 제어하는 ​​것을 보게 됩니다. 다음으로 마우스 포인터 스타일 커서 제어를 소개합니다. 시스템 기본 마우스 포인터 스타일 외에도 CSS를 통해 그림을 마우스 포인터로 설정할 수 있습니다. 일부 웹사이트에서는 마우스 포인터에 다양한 작은 그림 스타일을 사용하는 것이 일반적입니다. CSS 커서를 통해 스타일을 지정합니다.

커서: 자동 | 십자선 | 이동 | 대기 | 텍스트 크기 조정 | 크기 조정 | -resize | nw-resize |pointer | url(url)

일반적으로 사용되는 커서 커서 설명

1), div{ 커서:기본값 }은 일반 마우스 포인터

2), div{ 커서:손 } 및 div{ 커서: 텍스트 } 텍스트 선택 효과

3), div{ 커서:이동 } 이동 선택 효과

4), div{ 커서:포인터 } 손가락 모양 링크 선택 효과

5), div{ 커서:url(url 이미지 address) }객체를 그림으로 설정

마우스 포인터 설명

cursor 객체 위에서 움직이는 마우스 포인터가 사용하는 시스템 미리 정의된 커서 모양을 설정하거나 검색합니다.

레이아웃 구조

p { 커서: 텍스트 } /* css

Comments

: 마우스가 html p 개체로 이동할 때 텍스트 선택 스타일로 변경되도록 설정*/a { 커서: 포인터 } / * CSS 설명:

hyperlink

개체에 마우스가 이동하면 손가락 모양으로 변경되도록 설정(링크 선택) */body {cursor: url("작은 그림 주소")} /* 마우스 포인터 설정 기본적으로 작은 그림으로 */

확장 읽기: css a, css a link, a hover, css 하이퍼링크 스타일

마우스 포인터 스타일 요약

마우스 포인터 스타일 제어 설정은 예를 들어 DIV를 레이아웃할 때 비교적 일반적입니다. +CSS는 매일 마우스가 가리키기를 원합니다. 로컬 범위 태그 개체를 사용하면 마우스 포인터가 손가락 상태로 변경됩니다. 이때 커서 포인터는 개체 범위에 설정됩니다. 위의 그림은 일반적으로 사용되는 마우스 커서 모양과 CSS 단어를 보여줍니다. 레이아웃할 때 마우스 포인터 스타일을 설정할 수 있기를 바랍니다. 커서를 남용해서는 안 되며 사용자 정의 이미지를 마우스 스타일로 쉽게 설정하지 마십시오. 이렇게 하면 웹 페이지가 복잡해지고 사용자 경험과 일치하지 않게 됩니다.

이 소개를 마치면 모든 사람이 커서 속성에 대해 더 깊이 이해하게 될 것이라고 믿습니다. 더 흥미로운 내용을 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!

관련 읽기:

div 플로팅 레이어와 기본 div 레이어 사이의 관계는 무엇입니까?

DIV에 어떤 CSS 속성 스타일이 설정되어 있는지 어떻게 알 수 있나요?

브라우저가 html5를 지원하는지 확인하는 방법

위 내용은 CSS의 커서 속성을 설정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!