CSS の［cursor］プロパティで、マウスカーソルの形状を変更する方法を紹介します。

マウスカーソルの形状

通常「cursor」プロパティには以下の値を指定できます。

  • auto
  • default
  • pointer
  • crosshair
  • move
  • text
  • wait
  • help
  • n-resize
  • e-resize
  • s-resize
  • w-resize
  • ne-resize
  • se-resize
  • nw-resize
  • sw-resize
  • url

また、独自拡張となりますが以下の値を指定することもできます。
この場合、古いブラウザでは対応していないことが多いです。

  • col-resize
  • row-resize
  • all-scroll
  • not-allowed
  • no-drop
  • progress
  • vertical-text

cursor:url; を指定する場合は、任意の画像をカーソルとして使用することができます。

.sample {cursor:url(cursor.cur);}

カーソルに使用できる画像ファイルの形式は、IEの場合はカーソル（.cur）とアニメーションカーソル（.ani）のみ。Firefoxの場合はGIFやJPEG、PNGなども使用できるようです。
こちらは対応するブラウザが少ないので使用する際は注意が必要ですね。

下記ページにデモを用意したので合わせてご確認ください。

CSS［cursor］：サンプル