hoz blog

営業からSEに転職した文系エンジニアです。プログラミングと趣味の株に関してブログを書いていこうと思います。

bootstrapのgrid systemを使ってみる

grid systemを使って、

大阪のうどんの名店「うだま」

の文字を以下のように中央に配置してみます。
f:id:takanori5:20171028122040p:plain




以下のbootstrapのページにアクセス

Grid system · Bootstrap
f:id:takanori5:20171028122254p:plain


offsetting columnsに利用例が載っています。

中央揃えにしたかったら

col-md-6 col-md-offset-3

と指定すればいいみたいです。

以下のようにすればOK

   <div class="row">
   	//grid systemで中央揃えに!
     <div class="col-md-6 col-md-offset-3 text-center">
       <h1 class="display-3">うだま!</h1>
     </div>
   </div>