デイトラ学習にっき🌷DAY12-14 Bootstrapでのサイト制作

学習時間📚　2/4(木)1.5h・2/6(土)2.5h

つまづき箇所

【About】

①colのmd表記の漏れ
col-md-6 :PCサイズの場合は画面の半分のブロックを占める
→PCサイズを下回る場合は縦並びになる

※Colの基本的な考え方は設定したサイズ(xs/sm/md/lg)の画面幅を下回ると縦並びになる

②画像のサイズを画面からはみ出さないようにするには　imgにclass="w-100"をつける
→親ブロックに対して横幅100%まで

【Plans】

※PlansのレイアウトにはGridcardsを利用

①グリッドレイアウトでの列の表記方法
.row-cols-*
→一つのrow(行)にcolをいくつ並べるかを簡単に表すためのclass
.row-cols-1 :基本は1列
.row-cols-md-3:ただしPCサイズを下回らなければ3列

②表を挿入したい時にはlistを利用する

【Contact】

①Formを横並びにしたい時は、FormGridをそのままコピーして活用

②ボタンを中央に寄せたい場合は　mx-auto
  しかしbootstrapのbtnクラスはdisplayがinline-blockになっているため、
d-blockクラスを追加してこれを解除する。