clip Property
clip Propety
clip Property는 Positioning 된 4각형 Block Box를 지정하는 수치만큼 가려서 안 보이도록 해 주는 Property입니다. clip 되는 Box는 반드시 { position : absolute }로 지정되어 있어야 합니다.
[표 보는 방법]| clip Property | |
| Value | <shape> | auto | Inherit |
| Initial | auto |
| Applies to | block-level and replaced elements |
| Inherited | no |
| Percentages | N/A |
| Media | Visual |
| HTML Syntax | { clip: sClip } |
| Scripting | object.style.clip [ = sClip ] |
CSS Scripting
onMouseOver="this.style.clip='rect(auto)';" *모든 clip을 제거할 때는 auto 한 번만 지정한다.
clip Property의 사용값
- auto
초기 값으로서 clip이 되어서 가려지는 부분이 없이 몽땅 보여주고, 4면을 모두 auto로 지정할 때는 auto 한 번만 지정해 주면 됩니다. - shape
rect(top right bottom left) 로 지정합니다. rect는 rectangular의 약자로 4각형이라는 뜻 입니다. 그런데 여기서 지정하는 값이 약간 헷갈리므로 주의해야 됩니다.
top : 지정한 길이만큼 위에서 아래로 가려서 안 보입니다.
right : 지정한 길이만큼 왼쪽에서 오른쪽으로 보여 줍니다.
bottom : 지정한 길이만큼 위에서 아래로 보여 줍니다.
left : 지정한 길이 만큼 왼쪽에서 오른쪽으로 가려 줍니다.
- 아래는 top, right, bottom, left를 각각 15px 씩 clip 했습니다. Mouse를 그림 위에 올리면 설명글이 나오니까 참고 하시져.
소스 보기
이 문서의 저작권은 www.cadvance.org 에 있습니다.
| Top |
| Back |
| New |
| 검색 |