【HTML/CSS】要素にマウスカーソルを重ねた時にカーソルの形を指マークにする #CSS

一般的なリンクに対しては、マウスオーバーした時に勝手にカーソルが指マークになります。

しかし、そうならない要素に対しては、cssで独自に指定をするとユーザーの利便性が向上すると思います。

.yubi {
  cursor : pointer;
}

<span class="yubi">テキスト</span>

上記の例では「テキスト」とある部分にマウスを重ねると指マークになります。

cursorプロパティの値

また、cursorプロパティの値ですが、pointer以外にも色々あるので、場合によって値を変えるとより利便性が増すと思います。

helpで表示されるはてなマークなんかは使い勝手が良さそうですね。

pointerと指定するだけでも十分かもしれませんが、実は画像も指定できます。

(一番下の福笑いみたいになっているやつがおもしろい)

ちょっとした配慮で、より使いやすいWebサイトになると思うので、自分も積極的に使っていきたいです。