Css mouse icon property. How to style the cursor CSS.

This article was written by in November 19, 2013, & may not be posted on other sites!
Original source url for this article: Css mouse icon property. How to style the cursor CSS.

CSS mouse icon property. How to style the cursor CSS.
The cursor has some browser default properties, for example an arrow icon, a hand or a text-indicator icon on paragraphs. You can style the cursor as you wish with different CSS properties. This is how to style the mouse icon CSS property.

Css mouse icon property. How to style the cursor CSS

Mouse icon: POINTER / HAND
#pointer{
cursor: pointer;
}

Mouse icon: ARROW
#arrow{
cursor: default;
}

Mouse icon: TEXT INDICATOR
#text{
cursor: text;
}

Mouse icon: CROSSHAIR
#crosshair{
cursor: crosshair;
}

Mouse icon: CUSTOM IMAGE
(You will need 2 images, one .png and one .cur – The support in IE is limited)
#custom{
cursor: auto;
cursor: url(images/icon.cur); /* IE */
cursor: url(images/icon.png) 0 0, auto;
}

 

CSS MOUSE ICON – DEMO

There are a lot of different mouse icon css properties. Check out a full demo or download source files.

 

Spread the word

Facebooktwittergoogle_pluslinkedinmail

Leave a Reply

Your email address will not be published. Required fields are marked *