예제 4-21. 마우스 커서 제어, cursor
WEB/CSS3-CONCEPT 2017. 11. 4. 18:54 |cursor : value
auto/default(기본), crosshair(십자 모양), pointer(포인터모양), move(움직임모양), copy(복사모양), help(도움말모양), progress(프로그그램 실행 중 모양), text, wait, zoom-in, zoom-out, n-resize(상하크기조절 모양), e-resize(양옆크깆절 모양), ne-resize(대각선크기조절 모양)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>마우스 커서</title> </head> <body> <h3>마우스 커서</h3> 아래에 마우스를 올려 보세요. 커서가 변합니다. <hr> <p style="cursor: crosshair">십자 모양 커서</p> <p style="cursor: help">도움말 모양 커서</p> <p style="cursor: pointer">포인터 모양 커서</p> <p style="cursor: progress">프로그램 실행 중 모양 커서</p> <p style="cursor: n-resize">상하 크기 조절 모양 커서</p> </body> </html> | cs |
'WEB > CSS3-CONCEPT' 카테고리의 다른 글
| 예제 5-10. 마우스가 올라오면 행의 배경색이 변하는 표 만들기. 3. 표 꾸미기 (0) | 2017.11.06 |
|---|---|
| 예제 5-9. CSS3 스타일을 응용하여 리스트로 메뉴 만들기 (0) | 2017.11.06 |
| 예제 4-20. box-shadow 프로퍼티로 박스 그림자 만들기 (0) | 2017.11.04 |
| 예제 4-19. text-shadow 프로퍼티로 텍스트 그림자 만들기 (0) | 2017.11.04 |
| 예제 4-18. <div> 박스에 배경 꾸미기 (0) | 2017.11.04 |