WP マウスオーバーで画像半透明に変更 TwentyEleven

投稿日時: 投稿者:

ワードプレス初心者のカスタマイズ 作業15

wordpress

WordPressのテーマを直接変更

マウスオーバー（ロールオーバー・オンマウス）で画像半透明

ワードプレスのテーマTwentyElevenのマウスオーバー（ロールオーバー・オンマウス）で画像半透明に変更します。

スタイルシート(style.css)の編集

管理画面『外観』 >> 『テーマ編集』からスタイルシート(style.css)を開いて下さい。
※スタイルシート(style.css)の変更する前にバックアップしてください。
※小テーマを使用している方は、小テーマ側のスタイルシートを編集して下さい
テーマを更新（アップデート）した場合は、テーマに加えたカスタマイズがすべて失われます。テーマを修正する場合、子テーマの利用を検討してください。子テーマを使用すればテーマの変更は確実に保持されます。

文章を追加

※スタイルシート (style.css)の変更前にバックアップしてください
以下の文章を追加します

/* マウスオーバーで画像半透明 */

a:hover img {
     opacity: 0.7;     /* 透過レベル */
     filter: alpha(opacity=70);
}

画像にリンク先URLが入力してある場合は、マウスオーバーで半透明になるようになりました。

テーマ更新

新しいバージョンに「テーマを更新」した場合は、テーマに加えたカスタマイズがすべて失われます。
テーマを修正する場合、子テーマの利用をした方がよさそうですが、勉強中なので子テーマのやり方がわかりません。
他のサイトで調べてください。

WordPress 作業カテゴリ

1.ヘッダータイトルの余白調整2.検索ボックスの位置変更3.『Proudly powered by WordPress』をCopyright ©に変更
4.固定ページのタイトルを非表示に変更5.メインサイドバーを変更6.メインサイドバーの調整
7.投稿(BLOG)タイトルの変更8.タグに枠をつける9.投稿にサイドバーを表示（プラグイン）
10.サイト全体の横幅サイズを1000pxから1400pxに変更11.サイトの余白をなくして横幅最大に変更12.サイトの上部余白を削除
13.ヘッダー画像のサイズ変更14.上部のグレーの線を削除15.マウスオーバーで画像半透明に変更
16.フッターエリアの色変更17.投稿ページにサイドバーを表示18.サイドバーの幅を変更
19.画像の枠線を消去20.表の上下の罫線を消去21.タイトルバーや文字の変更

関連記事

WP ヘッダータイトルの余白調整 TwentyEleven WP 『Proudly powered by WordPress』をCopyright ©に変更 TwentyEleven WP 固定ページのタイトルを非表示に変更 TwentyEleven WP 投稿にサイドバーを表示（プラグイン新規追加方法） TwentyEleven WP サイト全体の横幅サイズを1000pxから1400pxに変更 TwentyEleven WP サイトの余白をなくして横幅最大に変更 TwentyEleven WP ヘッダー上部のグレーの線を削除 TwentyEleven WP フッターエリアの色変更 TwentyEleven WP 画像の枠線を消去 TwentyEleven WP 表の上下の罫線を消去 TwentyEleven WordPress 4.7.2–jaに更新完了 WP タイトルバーや文字をCSSを使って変更 TwentyEleven