|
|
| 5번째 줄: |
5번째 줄: |
| 마우스 커서의 모양을 바꾸어 주는 틀<br> | | 마우스 커서의 모양을 바꾸어 주는 틀<br> |
| 값에 대해서는 아래 표 참고 | | 값에 대해서는 아래 표 참고 |
| {|{{style|class=wiki}} | | {|{{style|class=wiki|width=100%|align=center|layout=on}}{{#css: .cursor-cell { border: 1px solid var(--namu--table--border); height: 60px; background: linear-gradient(to right, white 50%, black 0); } }} |
| | |+흰색과 검은색으로 반씩 나뉜 박스 안에 마우스를 가져가 보세요 |
| |- | | |- |
| |colspan=3|주황색 위에 마우스를 올려 보세요.
| | !default |
| | !none |
| | !help |
| | !pointer |
| | !progress |
| |- | | |- |
| |{{style |align=center|padding: .3rem;}}|<div style=" display: inline-block; width: 22. 5px; aspect- ratio: 1 / 1; border: 1px solid black; background: orange; cursor: default;"> </div> | | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: default;"></div> |
| |default||기본 커서 | | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: none;"></div> |
| | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: help;"></div> |
| | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: pointer;"></div> |
| | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: progress;"></div> |
| |- | | |- |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: none;"> </div> | | |기본 커서 |
| |none||커서 숨김 | | |커서 숨김 |
| | |도움말 사용 가능 |
| | |클릭 가능 |
| | |백그라운드에서 작업 중, 상호작용 불가능 |
| |- | | |- |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: help;"> </div>
| | !wait |
| |help||도움말 사용 가능
| | !cell |
| | !crosshair |
| | !text |
| | !vertical-text |
| |- | | |- |
| |{{style |align=center|padding: .3rem;}}|<div style=" display: inline-block; width: 22. 5px; aspect- ratio: 1 / 1; border: 1px solid black; background: orange; cursor: pointer;"> </div> | | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: wait;"></div> |
| |pointer||클릭 가능 | | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: cell;"></div> |
| | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: crosshair;"></div> |
| | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: text;"></div> |
| | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: vertical-text;"></div> |
| |- | | |- |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: progress;"> </div> | | |작업 중, 상호작용 불가능 |
| |progress||백그라운드에서 작업 중, 상호작용 불가능 | | |표의 칸 선택 가능 |
| | |십자 커서 |
| | |텍스트 선택 가능 |
| | |세로 텍스트 선택 가능 |
| |- | | |- |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: wait;"> </div>
| | !alias |
| |wait||작업 중, 상호작용 불가능
| | !copy |
| | !move |
| | !no-drop |
| | !not-allowed |
| |- | | |- |
| |{{style |align=center|padding: .3rem;}}|<div style=" display: inline-block; width: 22. 5px; aspect- ratio: 1 / 1; border: 1px solid black; background: orange; cursor: cell;"> </div> | | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: alias;"></div> |
| |cell||표의 칸 선택 가능 | | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: copy;"></div> |
| | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: move;"></div> |
| | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: no-drop;"></div> |
| | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: not-allowed;"></div> |
| |- | | |- |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: crosshair;"> </div> | | |별칭이나 바로가기 만드는 중 |
| |crosshair||십자 커서 | | |복사 중 |
| | |움직이는 중 |
| | |현재 위치에 놓을 수 없음 (Windows와 Mac OS X에서는 not-allowed와 같음) |
| | |요청한 행동을 수행할 수 없음 |
| |- | | |- |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: text;"> </div>
| | !grab |
| |text||텍스트 선택 가능
| | !grabbing |
| | !all-scroll |
| | !col-resize |
| | !row-resize |
| |- | | |- |
| |{{style |align=center|padding: .3rem;}}|<div style=" display: inline-block; width: 22. 5px; aspect- ratio: 1 / 1; border: 1px solid black; background: orange; cursor: vertical- text;"> </div> | | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: grab;"></div> |
| |vertical-text||세로 텍스트 선택 가능 | | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: grabbing;"></div> |
| | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: all-scroll;"></div> |
| | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: col-resize;"></div> |
| | |{{style|padding: .3rem;}}|<div class="cursor-cell" style="cursor: row-resize;"></div> |
| |- | | |- |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: alias;"> </div>
| | |잡아서 이동 |
| |alias||별칭이나 바로가기 만드는 중
| | |잡고 있음 |
| |-
| | |모든 방향으로 이동 가능 (Windows에서 move와 같음) |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: copy;"> </div>
| | |항목/행의 크기를 좌우로 조절할 가능. 종종 상하 화살표의 가운데를 가로로 분리한 모양을 사용 |
| |copy||복사 중
| | |항목/열의 크기를 상하로 조절 가능. 종종 상하 화살표의 가운데를 가로로 분리한 모양을 사용 |
| |-
| |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: move;"> </div>
| |
| |move||움직이는 중
| |
| |-
| |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: no-drop;"> </div>
| |
| |no-drop||현재 위치에 놓을 수 없음 (Windows와 Mac OS X에서는 not-allowed와 같음)
| |
| |-
| |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: not-allowed;"> </div>
| |
| |not-allowed||요청한 행동을 수행할 수 없음
| |
| |-
| |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: grab;"> </div>
| |
| |grab||잡아서 이동
| |
| |-
| |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: grabbing;"> </div>
| |
| |grabbing||잡고 있음
| |
| |-
| |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: all-scroll;"> </div>
| |
| |all-scroll||모든 방향으로 이동 가능 (Windows에서 move와 같음)
| |
| |-
| |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: col-resize;"> </div>
| |
| |col-resize||항목/행의 크기를 좌우로 조절할 가능. 종종 상하 화살표의 가운데를 가로로 분리한 모양을 사용
| |
| |-
| |
| |{{style|align=center|padding: .3rem;}}|<div style="display: inline-block; width: 22.5px; aspect-ratio: 1 / 1; border: 1px solid black; background: orange; cursor: row-resize;"> </div>
| |
| |row-resize||항목/열의 크기를 상하로 조절 가능. 종종 상하 화살표의 가운데를 가로로 분리한 모양을 사용
| |
| |} | | |} |
|
| |
|
| {{김찬 제작 틀}} | | {{김찬 제작 틀}} |
