2018/06/22
こんにちら!つなぐる株式会社の前橋です。 今回は、前回のブログの続き、DIV要素全体をリンクにする方法のご紹介をしたいと思います。 以前は、テキストのみのボタンの作成をご紹介しましたが、今回は、画像+文字にリンクを効かせる紹介をしたいと思います。
今回は、div要素全体にhoverを効かせるパターンを紹介したいと思います。
HTML
CSS
デモ
ポイントは、タグで全体を囲ってあげた後、前回紹介したときと同様に display: iniline-block;をかけて、width,paddingで大きさを調整してあげることです。
マスターするとデザインの幅も広がるので、是非使ってみて下さい。