CSSでマウスカーソルの見た目を変更

マウスカーソルは、CSSによってある程度変更することができます。
面白いですよね。

CSSは例えば以下の用に指定します

.test { cursor: pointer; }

ここにマウスカーソルを乗せると、pointerというカーソルに変わります。

以下は基本的なバリエーションになります。

auto : 自動選択

default : デフォルト

pointer : リンク

crosshair : 十字

move : 移動

text : テキスト編集

wait : 待機・処理中

help : ヘルプ

n-resize : 上方向のリサイズ

s-resize : 下方向のリサイズ

w-resize : 左方向のリサイズ

e-resize : 右方向のリサイズ

ne-resize : 右上方向のリサイズ

se-resize : 右下方向のリサイズ

nw-resize : 左上方向のリサイズ

sw-resize : 左下方向のリサイズ

素材のトップへ

スポンサードリンク

スポンサードリンク

SOZAI | 素材

その他