BlockDesign by BiNDIsm

features_018

ダウンロード（会員限定）

リクエストの多かったカラム全体にリンク設定したBlockDesign

 
最近よく見るパターンで、このようにしたいという希望をいただくことが多かったカラム全体にリンクを設定するブロック。マウスオーバーでカラム全体の背景色を変える設定にしています。
リスト：ニュース式を使いアイコンと文字を横並びにしています。

吾輩は猫である。

どこで生れたかとんと見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

吾輩は猫に似た虎である。

どこで生れたかとんと見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

features_018a

fontawesomeを使ったパターン。DRESSで角丸にしています。

吾輩は猫である。

どこで生れたかとんと見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

吾輩は猫に似た虎である。

どこで生れたかとんと見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。ニャーニャー泣いていた事は記憶している。

features_018b

カラムの右下にafter要素にborderで作ったアクセントを入れたパターン

吾輩は猫である。

どこで生れたかとんと見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

吾輩は猫である。

どこで生れたかとんと見当がつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。
  • 小見出し、本文はサイト全体のDRESS設定を受けます。
  • features_018aはアイコンにfontawesomeを使えるようにカスタムタグをブロック内に入れてあります。
  • features_018aのアイコンは HTML（iタグ）の形式で入れています。このカスタムタグの編集でアイコンを変更してください。
  • マウスオーバー時のカラム背景色はDRESSで設定していますので自由に変更可能です。
  • リスト：ニュース式の左（th）の縦位置で、パソコンでは中央配置、スマホでは上配置にしています。タブレットではパソコンの設定になりますので、お好みで上配置に変更したい時はDRESSから変更可能です。

Tablet View


features_018
 

features_018a
 

features_018b

SP View


features_018
 

features_018a
 

features_018b