チップの日常

管理人チップの日常の出来事や気になる事を綴るブログ

【CSS】画像と文字を重ねて全体にリンクを付ける方法

 スポンサード リンク

 ↑今回は画像と文字を重ねて、その全体にリンクをかける方法をご紹介します。


※画像と文字を重ねる方法については今回は割愛します。画像と文字を重ねる方法・解説は下の記事に書いたので、参考にしていただけると幸いです。

重ねたもの全体にリンクを付ける

HTML

 ↑「【CSS】画像の上に文字や画像を重ねて表示させる方法 - チップの日常」で使ったHTMLコードを少し変更。

 リンクが画像と文字両方にかかるように「a」で囲みます。

CSS

 ↑「【CSS】画像の上に文字や画像を重ねて表示させる方法 - チップの日常」で使ったCSSコードを少し変更。

 全体がリンクになるように「display:block;」を使いました。

PAGE TOP