カードデザインとは、カードのような四角形を並べたスタイルのデザインです。Pintarestを初め、twitterなど有名なWebサイトでよく見かけるスタイルです。
Bootstrap4では初めからカードデザインのコンポーネントが用意されていますが、Bootstrap3では用意されていないので、自作する必要があります。
そこでBootstrap3でも簡単に出来るカードデザインのサンプルを紹介します。
今回は例として3種類ご紹介します。
①写真付きカードデザイン
枠の中に写真と文章を入れるタイプです。
②アバター＆写真付きカードデザイン
写真の真ん中にアバター写真又はアイコン画像を入れるタイプです。
③円の中の数字と線でステップを表すパターン
アイコン画像を中央に入れるタイプです。
