2018.07.19 12:32

커서(cursor) 모양 정리

조회 수 187 추천 수 0 댓글 0

​마우스 커서 모양에 대해 알아보겠습니다.

보통 cursor 작업을 하면 pointer 위주로 작업을 합니다.

하지만 pointer 외에 아주 많는 cursor 가 있습니다.

그종류에 대해 소스와 샘플을 올려봅니다.

적절한 cursor 지정을 통해 사용자 편의를 고려해보시기 바랄께요~

 

[소스]Cursor 모양

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<span style="cursor:auto">auto</span><br/>
<span style="cursor:crosshair">crosshair</span><br/>
<span style="cursor:default">default</span><br/>
<span style="cursor:e-resize">e-resize</span><br/>
<span style="cursor:grab">grab</span><br/>
<span style="cursor:help">help</span><br/>
<span style="cursor:move">move</span><br/>
<span style="cursor:n-resize">n-resize</span><br/>
<span style="cursor:ne-resize">ne-resize</span><br/>
<span style="cursor:nw-resize">nw-resize</span><br/>
<span style="cursor:pointer">pointer</span><br/>
<span style="cursor:progress">progress</span><br/>
<span style="cursor:s-resize">s-resize</span><br/>
<span style="cursor:se-resize">se-resize</span><br/>
<span style="cursor:sw-resize">sw-resize</span><br/>
<span style="cursor:text">text</span><br/>
<span style="cursor:w-resize">w-resize</span><br/>
<span style="cursor:wait">wait</span><br/>
<span style="cursor:not-allowed">not-allowed</span><br/>
<span style="cursor:no-drop">no-drop</span>
cs

 

[결과]Cursor 모양(마우스를 올려보세요)

auto
crosshair
default
e-resize
grab
help
move
n-resize
ne-resize
nw-resize
pointer
progress
s-resize
se-resize
sw-resize
text
w-resize
wait
not-allowed
no-drop

    댓글이 하나도 없네요ㅠㅠ
    자료가 도움이 되었다면 댓글과 평가 부탁합니다.
?

Html Tips

홈페이지 작성시 요긴하게 사용되어지는 Html들을 정리해 놓았습니다

List of Articles
번호 제목 글쓴이 날짜 조회 수
58 TD안엔 DIV를 넣어라? 1 팔공산 2008.04.04 15788
57 CSS : 글꼴과 텍스트(2) - 장식과 자간 및 줄간 1 file 팔공산 2008.07.19 12532
56 IE 버젼별로 css 따로 적용하는 방법 file 팔공산 2011.02.17 12469
55 ( align="absmiddle" ) 이미지와 글자 높낮이가 다를때 관해서 3 file 팔공산 2008.04.27 12130
54 이미지 바꾸기 소스 1 감로수 2009.06.06 10253
53 익스6에서만 작동되게하는 css구문 팔공산 2009.02.19 9855
52 마퀴태그의 기본 팔공산 2010.02.06 9815
51 뒤로..앞으로..새로고침 버튼 넣기 팔공산 2008.07.12 9338
50 CSS 기초 깨우치기 1 팔공산 2008.10.12 9250
49 기본적인 태그 (링크걸기)| 1 팔공산 2008.07.12 9122
48 display:block 쪼금 더~ 팔공산 2008.04.04 8959
47 CSS 사용시 익스플로러 버그 해결하기 file 팔공산 2008.07.19 8769
46 글들의 상하 정렬위치 설정 vertical-align속성 file 팔공산 2008.04.04 8710
45 iframe 대신 사용하는 object 태그 1 팔공산 2008.04.04 8514
44 테이블(셀) 깨지지 않는 CSS 1 팔공산 2008.07.12 8501
43 이미지 없이 그라데이션효과 주기 팔공산 2008.07.12 8210
42 사각박스 코너를 이미지없이 둥글게 만드는법 file 팔공산 2008.04.08 8200
41 CSS로 바꾸어 쓰는 HTML태그!.. [XHTML약간^^;] 1 팔공산 2008.04.04 7723
40 자신의 홈페이지 단어를 더블클릭하면 네이버로 해당단어 검색을 1 팔공산 2008.07.12 7378
39 붙어야 할 이미지가 붙지 않을때. file 팔공산 2008.04.19 7357
목록
Board Pagination Prev 1 2 3 Next
/ 3
서버에 요청 중입니다. 잠시만 기다려 주십시오...