【ブロック全体のリンク設定について】 - 井上 昭弘 - 専門家プロファイル

専門家の皆様へ 専門家プロファイルでは、さまざまなジャンルの専門家を募集しています。
出展をご検討の方はお気軽にご請求ください。
井上 昭弘 専門家

井上 昭弘
ITコンサルタント

1 good

【ブロック全体のリンク設定について】

2013/05/15 14:19
(
5.0
)

はじめまして。株式会社雅の井上と申します。
下記のように、HTMLとCSSそれぞれ記述して頂ければ、ご希望の動作になるかと思います。


<!-- html-->
<a href="<?php the_permalink() ?>" class="block">
<div class="flo_le9 clearfix <?php echo add_class($related); /* Green 独自関数 - テーマ用のクラスを付ける */ ?>">
<div class="flo_le7">
アイキャッチ画像掲載
</div>
<div class="flo_ri2">
タイトル・本文・続きを読む を掲載
</div>
</div>
</a>
<!-- html-->

<!-- css-->
/*
* aタグをブロック要素に変更
*/
.block{ display: block;}

/*
* aタグのオンマウス時処理_背景色変更
*/
.block:hover{ background: #eee;}
<!-- css-->


尚、例で頂いたURLのサイトでは背景色がふわっと変わるようになっておりますが、これは別途javascript等のスクリプト処理が必要になりますので、今回は省いております。

HTML
CSS

評価・お礼

plussman さん

2013/05/18 15:35

ありがとうございます。出来ました!感謝しております!!
フワッと出る方法も教えていただくことは可能でしょうか?

回答専門家

井上 昭弘
井上 昭弘
( 東京都 / ITコンサルタント )
株式会社雅 代表取締役
03-5843-9329
※お電話の際は「"プロファイル"を見た」とお伝え下さい。

中国ビジネス x インターネット事業はお任せ下さい!

中国ビジネス、インターネット事業ともに、まだまだ大きな可能性を秘めている分野です。私は中国国内での多数の地域での人間関係及び経験と、インターネットの技術を用いて、日中双方のビジネスに野心を燃やしております。

(現在のポイント:-pt このQ&Aは、役に立った!

この回答の相談

wordpress 記事一覧のリンク設定について

法人・ビジネス ホームページ・Web制作 2013/05/14 13:03

wordpress初心者です。
トップページに最新ブログ記事を表示させる際に
記事全体(アイキャッチ画像・タイトル・本文・日付)にリンク設定をするにはどうしたらよいでしょうか?また「hov… [続きを読む]

plussmanさん (東京都/53歳/男性)

このQ&Aに類似したQ&A

Amebaブログのデザイン変更について tcnさん  2013-10-04 08:51 回答1件
ミラーブログを作られています oceさん  2013-07-09 17:19 回答1件
+ Twitterの可能性、活用方法について 玲さん  2007-06-28 01:10 回答6件
SEOと画像について bamboooさん  2016-07-12 21:15 回答2件