cursor
解説
マウスカーソルの形状を指定します。URLは最優先順に複数指定することができますが、キーワードは最後に1回のみ指定できます。オリジナルカーソルに使用できるファイル形式は、.CUR と.ANI のみのUAが多いようです。
プロパティ情報
値: | URIは複数指定することができ(指定せずとも良い)、auto ,crosshair ,default ,pointer ,move ,e-resize ,ne-resize ,nw-resize ,n-resize ,se-resize ,sw-resize ,s-resize ,w-resize| text ,wait ,help の中からいずれか1つ(URIを指定した際は指定せずとも良い) |
---|---|
初期値: | auto |
適用対象: | 全ての要素 |
継承: | する |
パーセンテージ: | 不可 |
適用メディア: | 視覚 |
レベル: | 2 |
参照
使用例
ソース
CSSの記述方法はスタイルシートってなに?も参照下さい。 <p style="cursor: auto">ブラウザが自動的に選択</p> <p style="cursor: default">利用環境の標準</p> <p style="cursor: pointer">リンク</p> <p style="cursor: crosshair">十字</p> <p style="cursor: move">移動</p> <p style="cursor: text">テキスト編集</p> <p style="cursor: wait">待機・処理中</p> <p style="cursor: help">ヘルプ</p> <p style="cursor: n-resize">北方向のリサイズ</p> <p style="cursor: s-resize">南方向のリサイズ</p> <p style="cursor: w-resize">西方向のリサイズ</p> <p style="cursor: e-resize">東方向のリサイズ</p> <p style="cursor: ne-resize;">北東方向のリサイズ</p> <p style="cursor: nw-resize;">北西方向のリサイズ</p> <p style="cursor: se-resize">南東方向のリサイズ</p> <p style="cursor: sw-resize;">南西方向のリサイズ</p> <p style="cursor: hand">指型</p> <p style="cursor: no-drop">ドロップ禁止(IE6以上)</p> <p style="cursor: all-scroll">全スクロール(IE6以上)</p> <p style="cursor: col-resize">横方向のリサイズ(IE6以上)</p> <p style="cursor: row-resize">縦方向のリサイズ</p> <p style="cursor: progress">進行中(IE6以上)</p> <p style="cursor: not-allowed">禁止(IE6以上)</p> <p style="cursor: vertical-text">縦書き(IE6以上)</p> <p style="cursor: url('./samp.ani')">オリジナルカーソル(IE6以上)</p>
表示結果
ブラウザが自動的に選択
利用環境の標準
リンク
十字
移動
テキスト編集
待機・処理中
ヘルプ
北方向のリサイズ
南方向のリサイズ
西方向のリサイズ
東方向のリサイズ
北東方向のリサイズ
北西方向のリサイズ
南東方向のリサイズ
南西方向のリサイズ
指型
ドロップ禁止(IE6以上)
全スクロール(IE6以上)
横方向のリサイズ(IE6以上)
縦方向のリサイズ
進行中(IE6以上)
禁止(IE6以上)
縦書き(IE6以上)
オリジナルカーソル(IE6以上)