[Bootstrap]一体Bootstrapってなんだろう
はじめまして、ダディです。
今回から私もこの場を借りて日々の勉強のメモ書きをしていきますので、どうぞよろしくです。
今私はWebアプリで顔になる表示部をとにかく楽に、でも形になって欲しいというわがままを実現するため「Bootstrap」を勉強しています。
よってダディがこれからお送りするのは、Webサイト作成に大助かりなCSSフレームワーク「BootStrap」を
プログラム実用初心者の私でもせめて使い方だけわかるようにまとめたWikiもどきとなります。（ﾊﾟﾁﾊﾟﾁﾊﾟﾁ
「Bootstrap」とは
簡単に説明すると
「HTMLタグに予め用意されたクラス名を書くだけでCSSが実装される」
CSSフレームワークの一種。
その中でもBootstrapは、HTMLタグを綺麗に整列・デザインして、ページの外見からプログラムの中身まで
シンプルに美しく書けるCSSフレームワークと言えるでしょう。
普段HTMLでページを書くとき、慣れた人なら<div>タグを使うと思います。
例えば下のページを作るなら、以下のような書き方になると思います。
一つ一つのタグに長さがあったり、横並びにするためにfloatをCSSで指定してあげたりと、
いざ作ってみると大変です…。
しかし、Bootstrapを適用すればこんなにスッキリ。
さて、お気づきの点があると思いますが、このBootstrap。
最大幅が12で、どの行も数字を足せば12になっていると思います。
要はページを縦に12分割して、それぞれの<div>要素に合計12になるように分割した横幅を割り当てています。
全体幅の指定不要。分割した幅の指定不要。全部用意されています。合計12になるまで自動で横並びになっていきます。
テトリスのようにはめ込んでいくだけで綺麗に整列してくれるのがBootstrapの最大の特徴です。
しかもこの幅、PC用、タブレット用、スマートフォン用と、画面サイズ毎に別の割り当てにすることが出来るので、
レスポンシブWebデザインにも簡単にできてしまいます。
とっても便利ですね。
今回はここまで。Bootstrapについてどんなものなのかが理解出来たので、次からは早速使い方を書き連ねていきます。