CSS/Bootstrap4 の履歴(No.4)

• 履歴一覧
• 差分 を表示
• 現在との差分 を表示
• ソース を表示
• CSS/Bootstrap4 へ行く。
  • 1 (2019-10-12 (土) 11:16:57)
  • 2 (2019-10-12 (土) 11:32:23)
  • 3 (2020-04-14 (火) 20:18:24)
  • 4 (2022-10-14 (金) 13:16:53)

• SpringBootのviewとして利用中

基本†

• 固定幅の .container または全幅の .container-fluid （width: 100%）
• 列を使うならrowで囲む
• col-xx-数値でデバイスごとの列分割数を設定。複数のクラスを定義することでデバイスごとに横に並ぶ列を変えることができる

ブレークポイント†

xs,sm,md,lg,xl

縦持ちが多いスマホはxsにして、mdはミニサイズタブレットなので、lgをPC向けとする

form†

• 全部を横並びにしたい場合はform class="form-inline"
• 各要素をdiv class=form-groupで囲む。
• 特定の要素だけ横並びにしたい場合はdiv class=form-inline

移行†

一覧ページ†

li†