画像をホバーした時やボタンをホバーした時に、変化をつけたい！

という時によく使うhoverとopacity。

透過することにより「クリックできる」と思っていただけると思います。

使い方

まずは何も指定してない状態。

ホバーしても変化はありまあせん。

続いてboxに対してhoverとopacityを指定します。

.box:hover  {

opacity: 0.5;

}

このように指定します。

すると・・・

画像のようにホバー時には透過されます。

更にボタンなどはホバー時に、色を変えたり、動きをつけたりすると「クリックできる」という認識を持っていただけると思います。