cursor
カーソルの形
| ブラウザ |
|
|---|---|
| 適用対象 | |
| 継承 | 継承する |
| 初期値 |
auto
|
| メディア |
|
カーソルの形を指定するプロパティです。
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）を作成するには、アイコン作成ソフトなどが必要になります。
- このプロパティに関連する目的別リファレンス
- カーソルの形を変更する