User-interface - ユーザーインタフェース
- cursor〔カーソルの形状〕
cursor
カーソルの形状
unknown
cursor: auto | default | url("カーソル画像URL") | <キーワード>
cursorプロパティは、カーソルの形状を指定します。 すべての要素に指定可能です。 デフォルト値は、auto(ブラウザが設定したカーソル)です。
cursor: url("カーソル画像のURL")
でオリジナルカーソルを指定した場合、ユーザーの環境やブラウザによっては指定したカーソルが使用できない場合があるので、一般的なカーソルをカンマ区切りでリストの末尾に指定しておきましょう。
ex. <span style='cursor: url(./path/cursor.ani), wait;'>カーソル変更</span>
値 | カーソル | 説明 |
---|---|---|
auto | ![]() | ブラウザが設定したカーソル |
default | ![]() | デフォルトのカーソル(矢印) |
url | ![]() | オリジナルカーソルファイルへのパス。 ※拡張子がcur(カーソル)とani(アニメーションカーソル)のカーソルファイルを指定可。 |
crosshair | ![]() | 十字カーソル |
pointer | ![]() | リンクカーソル |
move | ![]() | 移動カーソル |
e-resize | ![]() | 東方向リサイズカーソル |
ne-resize | ![]() | 北東方向リサイズカーソル |
nw-resize | ![]() | 西北方向リサイズカーソル |
n-resize | ![]() | 北方向リサイズカーソル |
se-resize | ![]() | 南東方向リサイズカーソル |
sw-resize | ![]() | 南西方向リサイズカーソル |
s-resize | ![]() | 南方向リサイズカーソル |
w-resize | ![]() | 西方向リサイズカーソル |
text | ![]() | テキスト編集カーソル |
wait | ![]() | 待機中カーソル |
help | ![]() | ヘルプカーソル |
auto - ブラウザが設定したカーソル
default - デフォルトのカーソル(矢印)
url - オリジナルアイコン ※URLで指定したカーソルが使用できない場合はauto(ブラウザが設定したカーソル)を適用。
crosshair - 十字カーソル
pointer - リンクカーソル
move - 移動カーソル
e-resize - 東方向リサイズカーソル
ne-resize - 北東方向リサイズカーソル
nw-resize - 西北方向リサイズカーソル
n-resize - 北方向リサイズカーソル
se-resize - 南東方向リサイズカーソル
sw-resize - 南西方向リサイズカーソル
s-resize - 西方向リサイズカーソル
w-resize - 南方向リサイズカーソル
text - テキスト編集カーソル
wait - 待機中カーソル
help - ヘルプカーソル