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

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

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

Bootstrap 4 CheatSheet
Bootstrap 4 CheatSheet -GitHub

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

Bootstrap 4 チートシートのキャプチャ

コンポーネント一覧

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

Bootstrap 4 チートシートのキャプチャ

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

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

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

Bootstrap 4 チートシートのキャプチャ

コンポーネント一覧

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

Bootstrap 4 チートシートのキャプチャ

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

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

Bootstrap 4 チートシートのキャプチャ

固定型ナビゲーション

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

Bootstrap 4 チートシートのキャプチャ

追従型ナビゲーション

top of page

©2017 coliss