Bootstrap4 | クルーデザイン

2018/10/13 -Bootstrap4

スマホ用のサイトを作成するときに固定メニューはよく使いますよね。 Bootstrap4でもクラスを追加するだけで固定メニューを作ることができます。サンプルも作ってますので参考になると嬉しいです。 H …

2018/09/12 -Bootstrap4

Bootstrap4で画面サイズによってレイアウトのカラム数を変えたい場合のサンプルを作成しました。画面サイズに対応したクラスを追加してあげるだけで、簡単に実現可能です。サンプルを作成しましたので …

2018/09/10 -Bootstrap4

メインビジュアルを画面幅すべてを使って表示させたい時があります。 Bootstrap4では、以下のように簡単に実現可能です。 HTML Bootstrap4 画像を全画面に表示（レスポンシブでwidt …

2018/09/09 -Bootstrap4

Bootstrap4では、影（シャドウ）を付けるクラスが初めから用意されています。クラスを追加するだけで簡単に影（シャドウ）を付けることができます。 Bootstrap4 divに影（シャドウ）を付 …

2018/09/08 -Bootstrap4

Bootstrap4を使えば、レスポンシブなYouTubeリンクを貼り付けることができます。レスポンシブというのがミソです。普通にYouTubeリンクを貼ると、固定サイズになってしまいますからね。 …

2018/08/26 -Bootstrap4

Bootstrap4はテーブル関連のクラスも充実しています。クラスをいくつか追加するだけで、見栄えの良いテーブルを作成することができます。スプライトやホバーでの色変えなど、自分でCSSを作成しなく …

2018/08/12 -Bootstrap4

Bootstrap4のcolクラスは何もしなくても隙間をどんどん埋めていってくれる便利なものです。しかし、実現したいデザインによっては途中で折り返したいことも出てくると思います。そんな場合は「w-1 …

2018/04/17 -Bootstrap4

Bootstrap4でデザインを忠実に再現したい時に、colの隙間（padding）が邪魔なときがあります。この邪魔な隙間を無くしてしまおう！というのが今回の趣旨です。サンプルも作りました。 CS …

2018/04/15 -Bootstrap4

Bootstrap4では、インライン要素の左寄せ・右寄せ・中央寄せができるクラスがあらかじめ用意されています。 CSSをその都度書く必要はありません。クラスを追加することで、インライン要素を寄せること …

2018/03/29 -Bootstrap4

上下中央や上寄せ、下寄せに配置するためのクラスも用意されています。 flexboxを利用するため、それぞれ２つのクラスを指定すればOKです。 1. 上下中央寄せ「d-flex」と「align-ite …

「 Bootstrap4 」一覧