知らなかった!Bootstrap4に用意されているクラス
Bootstrap4には、実はいろいろなクラスが用意されているんですね。知りませんでした。
Bootstrap4には大量のクラスが用意されていますが、個人的に忘れがち&今後使っていこう&CSS記述の代替として個人的なメモをしていきます。
めんどくさいので、全体をコード記述にしていきます。(随時更新)
左寄せ
テキスト
中央寄せテキスト
テキスト
右寄せテキスト
テキスト
サイズ毎に右左中央を指定できる
text-left 、 text-center 、 text-right
text-sm-left 、 text-sm-center 、 text-sm-right
text-md-left 、 text-md-center 、 text-md-right
text-lg-left 、 text-lg-enter 、 text-lg-right
text-xl-left 、 text-xl-center 、 text-xl-right
最近は使用頻度は減ったが、floatもある
...
...
...
floatもサイズ毎に指定できる
float-left 、 float-center 、 float-right
float-sm-left 、 float-sm-center 、 float-sm-right
float-md-left 、 float-md-center 、 float-md-right
float-lg-left 、 tfloat-lg-enter 、 float-lg-right
float-xl-left 、 float-xl-center 、 float-xl-right
ブロックを左右センターにしたい時
中央寄せ
横幅も調整できます。33.3%があってもいいよね。
Width 25%
Width 50%
Width 75%
Width 100%
縦幅もあります。33.3%があってもいいよね。
Height 25%
Height 50%
Height 75%
Height 100%
max-width、max-heightも用意されています。
画像をレスポンシブ対応にするときによく使いますね。
clearfixも!用意されています。