Web sayfalarında CSS kullanarak fare imlecini değiştirebilirsiniz. Bunun için ilk olarak fare imlecinin nerede değişmesi gerektiğini belirlemeniz gerekiyor.

Not: Eğer tüm sayfada değişmesini istiyorsanız bunun için <body> tagını kullanmanız gerekiyor.

Fare imlecini deÄŸiÅŸtirmek istediÄŸiniz yerde yazmanız gereken kod ise style=”cursor:hand;” ÅŸeklindedir. ÖrneÄŸin tüm sayfada mouse imlecinin el ÅŸeklinde gözükmesi için <body> tagını aÅŸağıdaki gibi yazmanız gerekiyor.

<body style="cursor:hand;">

CSS cursor özelliğinin alabileceği değerler aşağıdaki gibidir:

url
Bu değer ile kendi tasarladığımız .cur uzantılı imleci tanımlayabiliyoruz.
Kullanım ÅŸekli <img style=”cursor:url(‘sat.cur’);” />

default
Varsayılan değer bildiğimiz ok şekli imleç. Değiştirdiğimiz imleçten varsayılan değere dönmek için sıkça kullanılır.
Kullanım ÅŸekli <img style=”cursor:default;” />

hand
Genellikle link izlenimi veren el şekilli bu imleç, ziyaretçiyi sol tıklamaya güdüler.
Kullanım ÅŸekli <img style=”cursor:hand;” /> 

crosshair
Ziyaretçiyi bir noktayı belirlemesi (nişan alması) yönünde güdüler.
Kullanım ÅŸekli <img style=”cursor:crosshair;” /> 

pointer
Ziyaretçiyi bir noktayı göstermeye güdüler.
Kullanım ÅŸekli <img style=”cursor:pointer;” />

move
Ziyaretçiyi bir şeyi tutup hareket ettirmeye güdüler.
Kullanım ÅŸekli <img style=”cursor:move;” />

e-resize
Herhangi bir nesneyi doğuya doğru genişletmek için kullanılır.
Kullanım ÅŸekli <img style=”cursor:e-resize;” />

ne-resize
Herhangi bir nesneyi kuzey doğuya doğru genişletmek için kullanılır.
Kullanım ÅŸekli <img style=”cursor:ne-resize;” />

nw-resize
Herhangi bir nesneyi kuzey batıya doğru genişletmek için kullanılır.
Kullanım ÅŸekli <img style=”cursor:nw-resize;” />

n-resize
Herhangi bir nesneyi kuzeye doğru genişletmek için kullanılır.
Kullanım ÅŸekli <img style=”cursor:n-resize;” />

se-resize
Herhangi bir nesneyi güney doğuya doğru genişletmek için kullanılır.
Kullanım ÅŸekli <img style=”cursor:se-resize;” />

sw-resize
Herhangi bir nesneyi güney batıya doğru genişletmek için kullanılır.
Kullanım ÅŸekli <img style=”cursor:sw-resize;” />

s-resize
Herhangi bir nesneyi güneye doğru genişletmek için kullanılır.
Kullanım ÅŸekli <img style=”cursor:s-resize;” />

w-resize
Herhangi bir nesneyi batıya doğru genişletmek için kullanılır.
Kullanım ÅŸekli <img style=”cursor:w-resize;” />

text
Ziyaretçiyi yazı yazmaya güdüler.
Kullanım ÅŸekli <img style=”cursor:text;” />

wait
Ziyaretçiye “bekle” der.
Kullanım ÅŸekli <img style=”cursor:wait;” />

help
Ziyaretçiyi yardım almak için tıklamasını güdüler.
Kullanım ÅŸekli <img style=”cursor:help;” />