ブログ
サポート
ログイン
会員登録
ログイン
会員登録
カテゴリから探す
目的から探す
出品者を探す
ブログを探す
募集をする
仕事を探す
出品する
ブログを投稿する
出品する
募集をする
ココナラブログ
:hoverについて
記事
IT・テクノロジー
Kaho_サイト制作★Webデザイナー
2021/10/17 09:18
:hoverとは要素をマウスオーバーした際に実行される疑似クラス。
(リンクを作成するときに使用するaタグと一緒に使用される)
疑似クラスとは、すでにいくつか用意されているクラスで、要素が特定の証券になったときに適応されるもの。
aタグに使用できる疑似クラスは…
link → visited → hover → active がある。
メリットとしては、マウスオーバーしたときに 『ココがリンクですよ!』
とわかりやすくページに誘導することができます。
こんな感じで背景カラーが変わるように設定!
マウスオーバーすると文字や背景の色を変えることができました!
WordPressのプラグイン
【 シンプルカスタムCSS&JS 】を使用して次のようにセレクタを指定してCSSを追加しました。
.body .has-watery-red-background-color:hover{
background-color: #f2b8b8;
}
できるようになったことをブログで書き留めていきたいと思っています。
参考になればと思います。
もし間違えなどあればご教授ください。
ではまた!さようなら~
#HTML/CSSコーディング
#HOVER
#ボタンのデザイン
#WordPress
#Wordpressカスタマイズ
Kaho_サイト制作★Webデザイナー
サイト制作・Webデザイナー / 30代前半 / 女性
一覧に戻る