cursor 【カーソル】
[IE5] [IE6] [IE7] [Fx1] [Fx2] [Op7] [Ns6] [Ns7]
cursorプロパティは、マウスカーソルの形状を指定する際に使用します。
.cur(カーソルファイル)と.ani(アニメーションカーソルファイル)を指定して、オリジナルカーソルを表示する事も出来ます。
cursorの使用例
CSSファイル
.sample001 {
color: #000000;
border: 1px solid #0066ff;
background-color: #ccccff;
margin: 10px;
}
※今回は見た目の指定のみです。カーソル指定は下記参照↓
HTMLソース
<p class="sample001" style="cursor: auto">
auto：ブラウザが自動選択</p>
<p class="sample001" style="cursor: default">
default：標準的なカーソル</p>
<p class="sample001" style="cursor: pointer">
pointer：リンクカーソル</p>
<p class="sample001" style="cursor: crosshair">
crosshair：十字カーソル</p>
<p class="sample001" style="cursor: move">
move：移動カーソル</p>
<p class="sample001" style="cursor: text">
text：テキスト編集カーソル</p>
<p class="sample001" style="cursor: vertical-text">
vertical-text：縦書きカーソル</p>
<p class="sample001" style="cursor: wait">
wait：待機・処理中カーソル</p>
<p class="sample001" style="cursor: progress">
progress：進行中カーソル</p>
<p class="sample001" style="cursor: help">
help：ヘルプカーソル</p>
<p class="sample001" style="cursor: hand">
hand：手型カーソル</p>
<p class="sample001" style="cursor: not-allowed">
not-allowed：禁止カーソル</p>
<p class="sample001" style="cursor: no-drop">
no-drop：ドロップ禁止カーソル</p>
<p class="sample001" style="cursor: n-resize">
n-resize：北方向のリサイズカーソル</p>
<p class="sample001" style="cursor: s-resize">
s-resize：南方向のリサイズカーソル</p>
<p class="sample001" style="cursor: w-resize">
w-resize：西方向のリサイズカーソル</p>
<p class="sample001" style="cursor: e-resize">
e-resize：東方向のリサイズカーソル</p>
<p class="sample001" style="cursor: ne-resize">
ne-resize：北東方向のリサイズカーソル</p>
<p class="sample001" style="cursor: nw-resize">
nw-resize：北西方向のリサイズカーソル</p>
<p class="sample001" style="cursor: se-resize">
se-resize：南東方向のリサイズカーソル</p>
<p class="sample001" style="cursor: sw-resize">
sw-resize：南西方向のリサイズカーソル</p>
<p class="sample001" style="cursor: col-resize">
col-resize：横方向のリサイズカーソル</p>
<p class="sample001" style="cursor: row-resize">
row-resize：縦方向のリサイズカーソル</p>
<p class="sample001" style="cursor: all-scroll">
all-scroll：全方向スクロールカーソル</p>
表示すると
auto：ブラウザが自動選択
default：標準的なカーソル
pointer：リンクカーソル
crosshair：十字カーソル
move：移動カーソル
text：テキスト編集カーソル
vertical-text：縦書きカーソル
wait：待機・処理中カーソル
progress：進行中カーソル
help：ヘルプカーソル
hand：手型カーソル
not-allowed：禁止カーソル
no-drop：ドロップ禁止カーソル
n-resize：北方向のリサイズカーソル
s-resize：南方向のリサイズカーソル
w-resize：西方向のリサイズカーソル
e-resize：東方向のリサイズカーソル
ne-resize：北東方向のリサイズカーソル
nw-resize：北西方向のリサイズカーソル
se-resize：南東方向のリサイズカーソル
sw-resize：南西方向のリサイズカーソル
col-resize：横方向のリサイズカーソル
row-resize：縦方向のリサイズカーソル
all-scroll：全方向スクロールカーソル
カーソル関連項目
| cursor | カーソルの形状を指定する |
