Bootstrap 4のさまざまなコンポーネント・レイアウトの実装方法がすぐ分かる便利なチートシート

Post on:2017年6月26日

sponsors

Bootstrap 4のグリッドの作り方、カード型コンポーネント、ナビゲーション、カルーセル、フォームなどの実装コードとどのように実装されるかが一枚のページにまとめられた、Bootstrap 4のチートシートを紹介します。

チートシートではBootstrap 4で使用できるさまざまなコンポーネントやレイアウトが一枚のページにまとめられています。

コンポーネント一覧

「Highright New in v4」をチェックすると、Bootstrap 4で新しくなったコンポーネントがハイライト表示されます。

Bootstrap 4で新しくなったコンポーネント

Bootstrap 4に移行する時は、下記の記事が参考になります。

チートシートではカテゴリごとに、Bootstrap 4のコンポーネントがまとめられています。

コンポーネント一覧

各コンポーネントを選択すると、コードとプレビューが表示されます。

カードのコードとプレビュー

コンポーネントは当然、Bootstrap 4のものですが、UIのアイデア帳としても活用できますね。

固定型ナビゲーション

ナビゲーションのコンポーネントも非常に充実しています。

追従型ナビゲーション