CSSでマウスオーバー時に画像を半透明にする

画像にリンクを貼る際、マウスを画像に載せると色が薄くなることで「クリック」できるということをユーザーに伝えることができます。

【サンプル】

2014OGP

CSS

a:hover img{
opacity:0.7;
}

Lightning テーマを使ってカスタマイズする方

管理画面の上ナビゲーション VK ExUnit – CSSカスタマイズを選択
スクリーンショット 2016-04-20 12.38.39

CSSカスタマイズに上記のCSSをコピペします。

スクリーンショット 2016-04-20 12.45.23

 

この記事を書いた人

佐々木亜紀
佐々木亜紀

株式会社アドプラス 代表取締役 佐々木亜紀
千葉コワーキングスペース201 オーナー

2009年9月開業。ウェブ制作業務を開始。
WordPressを使った制作を行い、中小企業、個人事業主、女性起業家のサイトを制作する傍ら、SNSなどウェブを使った集客全般のサポートを行う。
2013年よりコワーキングスペースを運営。

中小企業庁
ミラサポ専門家派遣事業登録専門家
千葉県産業振興センター登録専門家

「失敗しない初めてのワードプレスのコツ」のメルマガ

「失敗しない初めてのワードプレスのコツ」のメルマガに興味を持っていただきありがとうございます。

【こんな方のためのメールマガジンです】
・ワードプレスを使いこなして集客したい
・ワードプレスでブログを始めたいけど何からやればいいかわからない
・継続的で安全にワードプレスの運営をしたい

そんな方に役立つメルマガです。