2012/07/28

[Bootstrap]初めてのBootStrap1:基本レイアウト

Bootstrapがリニューアルしたので、使い方を勉強したいと思います。

まず最初は、レイアウトについて。

レイアウトセクションを読むと、

  • Fixed layout
  • Fluid layout
の二つに分かれるのですが、今日は、Fixed layoutのコーディング方法について。

さっそく下記のように組みました。
<body>
<div class="container">
 <h1>Bootstrap starter template</h1>
 <p>Use this document as a way to quick start any new project.
 <br>
 All you get is this message and a barebones HTML document.</p>
</div>
</body>
実行結果は、下のようになります。
Photobucket
まずbodyタグの直下に、divタグを追加します。
追加したdivタグのclassにcontainerを付与することにより完成です。

次回は、gridの組み方について書きたいと思います。

0 コメント:

コメントを投稿