cursor
- ブラウザ
カーソルの形
cursor: 値;
カーソルの形を指定するプロパティです。
cursor: wait;
| プロパティ名 | 値 | 表示例 | 説明 |
|---|---|---|---|
| cursor | auto |  |
状況に応じて自動選択 （初期値） |
| default | |
デフォルト | |
| pointer |  |
リンク | |
| crosshair |  |
十字 | |
| move |  |
移動 | |
| text |  |
テキスト | |
| wait |  |
処理中 | |
| help |  |
ヘルプ | |
| n-resize |  |
上リサイズ | |
| e-resize |  |
右リサイズ | |
| s-resize | |
下リサイズ | |
| w-resize | |
左リサイズ | |
| ne-resize |  |
右上リサイズ | |
| se-resize |  |
右下リサイズ | |
| sw-resize | |
左下リサイズ | |
| nw-resize | |
左上リサイズ | |
| url(URI) |  |
オリジナルカーソル （指定されたURIの画像をカーソルとして使用する） |
- 上記のセル内の画像は、Windowsでの表示例となります。ユーザーの環境により、カーソルの形は異なる場合があります。
- 「表示例」のセル内にカーソルを合わせると、実際の表示例をご覧いただけます。
- オリジナルカーソルは、IE 6以上、Firefox、Safari、Chromeで対応しています。
オリジナルカーソル
オリジナルカーソルを指定する場合は、画像が表示できない場合に備え、カンマ（ , ）に続けて任意のキーワードを指定しておきます。次の例では text を指定しています。
cursor: url(example.cur), text;
また、カンマ（ , ）で区切って複数のカーソル候補を設定しておくこともできます。この場合、ユーザーの環境で利用できる形式の画像が使用されます。（先に指定したものが優先されます）
cursor: url(example.cur), url(example.gif), auto;
カーソルに使用できるファイル形式は、IEの場合はカーソル（.cur）とアニメーションカーソル（.ani）だけです。Firefoxの場合は、GIFやJPEG、PNGなども使用できるようです。
※カーソル用の画像（.cur、.ani）を作成するには、アイコン作成ソフトなどが必要になります。
.example {
cursor: help;
}
