본문 바로가기

퍼블리싱/CSS/CSS3

cursor 속성값에 URL 사용

Gecko가 지원하는 모든 이미지 포맷을 사용할 수 있다. 

 cursor: [,]* keyword; 



형식으로 원하는 이미지를 순차적으로 넣은 후 맨 마지막에는 꼭 auto나 pointer처럼 기본적으로 지원하는 커서값을 넣어야한다.

예를 들면 다음처럼 쓰면 된다. 


cursor: url(foo.cur), url(http://www.example.com/bar.gif), auto;



css3에서는 다음처럼 추가적으로 속성값에 좌표값을 지원한다. 


cursor: url(foo.png) 4 12, auto;



IE에서는 cur, ani 포맷만 지원한다. 


curosr: url(foo.cur), pointer, url(bar.cur), auto; 



그러나 다른 브라우저에서는 지원안하기때문에, 다음처럼 다른 포맷이미지와 함께 사용하면 될듯하다. 


div{ cursor: url(smiley.gif),url(myBall.cur),auto;}



참고 : https://developer.mozilla.org/ko/docs/Web/CSS/cursor/Using_URL_values_for_the_cursor_property

  http://www.w3schools.com/cssref/playit.asp?filename=playcss_cursor&preval=url(smiley.gif),url(myBall.cur),auto