【HTML&CSS】画像やテキストなどにカーソルが触れた時にカーソルの形を指にする方法！

どうも皆さんこんにちは！kwです！

今回は、画像やテキストなど（要素）に触れた際にカーソルの形を指にする方法を解説します。

画像やテキストにカーソルが触れた際に、カーソルが指になると「ここはクリックできるんだ」と思わせることもできるので、是非覚えていってください！

※ついでにこの技術はめちゃくちゃ使います。

ということで、早速やっていきましょう。

方法はとても簡単です。

カーソルを合わせた時にカーソルが指になってほしい要素（画像やテキスト）にCSSで、cursor:pointer;と記述します。

いきなりこんなことを言われてもピンとこないという方が大半だと思うので、サンプルコードを貼っておきます。

こんな感じです↓

See the Pen Untitled by kw (@kw-webd) on CodePen.

なんとなく分かってもらえたでしょうか？

スマートフォン向けのサイトを作るならあまり使わない技術だと思いますが、PC向けにWebサイトを作っていきたいという方は、必須技術なので絶対に覚えておいてください！

なお、主な用途としては、「ここはクリックすることができるんだ」と思わせたい時に使います。

画像にリンクを埋め込んだ際に、カーソルが指になると「画像をクリックするんだな」と一瞬でわかりますので是非、覚えてみてはいかがでしょうか？

いかがでしたでしょうか？この技術はWebデザイナーには必須の技術なので是非覚えちゃってください。

ちゃんとコードが書けなくても、「こういう時にカーソルを指にするんだ。」と、どういう時にこの技術は使うのかだけでも覚えていただけたら幸いです。