カーソルのスタイルを変更する
スポンサーリンク

01カーソルの種類

HTML CSS
<a href="#">001</a>a {cursor: default}
<a href="#">002</a>a {cursor: pointer}
<a href="#">003</a>a {cursor: crosshair}
<a href="#">004</a>a {cursor: text}
<a href="#">005</a>a {cursor: vertical-text}
<a href="#">006</a>a {cursor: help}
<a href="#">007</a>a {cursor: n-resize}
<a href="#">008</a>a {cursor: e-resize}
<a href="#">009</a>a {cursor: s-resize}
<a href="#">010</a>a {cursor: w-resize}
<a href="#">011</a>a {cursor: ne-resize}
<a href="#">012</a>a {cursor: se-resize}
<a href="#">013</a>a {cursor: sw-resize}
<a href="#">014</a>a {cursor: nw-resize}
<a href="#">015</a>a {cursor: col-resize}
<a href="#">016</a>a {cursor: row-resize}
<a href="#">017</a>a {cursor: not-allowed}
<a href="#">018</a>a {cursor: vertical-text}
<a href="#">019</a>a {cursor: url(URL)}

まとめ
  1. ほとんどのカーソルはIE 6以上、Firefox、Safari、Chromeで対応していますが使用する前には必ず確認が必要です
  2. 独自の画像をカーソルとして使用する際、ファイル形式は.curと.aniに変換する必要があります。(以下参考サイトです。)
  3. 何事もやりすぎには注意しましょう。

スポンサーリンク

この記事が気に入ったらフォローしよう

おすすめの記事