カラムを並べ替える - Bootstrapのチュートリアル

このレッスンではカラムの順序を クラスで並べ替えてみます。 今開いている このページなんですけど row が２つあります。 そしてその中に幅４で カラムが３つずつ入っています。 ですから、同じ幅になっていますね。 三等分で３つ並んでいる ということになります。 この順序を変えてみたいと思うんですが まず、最初の行です。 一番最後のカラム３、 １・２・３となっていますけど ここに順序を指定したいと思います。 順序のクラスは order で始まります。 order-first というふうにすると 先頭になります。 カラム３が first という 設定をしたんですけど 先頭に来て、１・２ というふうになっています。 それから order のクラスは １から 12 までの整数を ハイフンの後にとることができます。 では今度はこのカラムの４ですね。 これに対して order-1 とします。 そうすると、なぜか 最後に行ってしまうんですね。 これ実は first と −1 は違うんですね。 first は本当に最初にくるんですが １・２・３と連番 12 までなんですけど その数字は何もオーダーがない ものの後になってしまいます。 ですからこのカラムの６なんですけど、ここに order-2 と入れると 今度はカラムの６が最後になって その前に１を指定したカラム４が来ています。 ここ、６の中に (1) と書いてありますが order-2 にしたので ２と書いておきましょう。 それからここに 12 と書いてあるんですが 連番の１から 12 まで 使うことができるんですけど 几帳面に１・２・３と 順番に並べる必要がありません。 ですから、例えばここで この括弧の中に書いてある通りなんですけど 12 とすると、これが最後になります。 ですから１がありませんし、 ３から 11 までがありませんけど 12 よりも２の方が前にくる ということで このような並び順になります。 それからブレークポイントを設定して レスポンシブにすることも可能です。 ですから、例えばここで order-12 とありますが これは large の倍だと いうふうに指定することができます。 そうするとこちらは large よりも 幅が狭いので カラム４が先頭に戻っています。 これはちょっとブラウザーで…