今回の記事ではマウスホバー時に透過させたい時のやる方を紹介いたします。

ホバー時に透過させることで、視認性を高めたり、ボタンやテキストなどクリックできるという認識を持っていただけると思います。

やり方

opcity: 〇〇;と指定します。

〇〇の部分に数字を入れます。

1が通常。

この青い四角形をホバー時に透過させたいとします。

青い四角形のクラス名をbox1とします。

.box1:hover { opcity:0.7;}と指定します。

すると・・・

このように透過させて表示することができます。