最近、java(もちろんjavascriptではない)への興味が湧いてきた犬吉です。CSS編のも5記事目になりました。classes具体的な表は、本家の表を参考。「xs」がついたclassは、768px以下。「sm」がついたclassは、768px以上。「md」がついたclassは、992px以上。「lg」がついたclassは、1200以上。そこ以外を非表示にする.visible-*。ピンポイントでそこだけ非表示にする.hidden-*。classes.visible-print-block、.visible-print-inline、.visible-print-inline-blockはブラウザでは非表示、印刷時に表示される。.hidden-printは、ブラウザでは表示、印刷時には非表示。変数やミックスインを把握しておけば、最小限の変更でBoostrapの全体の調整ができます。Variables設定されている変数について。変更すれば全体に影響がでます。言い換えれば、個々を変えればだいぶ変わるわけです。Colors色についての変数。#eeeグレースケールですね。サイトの背景色によっては調整の必要ありかな。#d9534f;いままで、primariyとかsuccessとかつくclassが沢山でてきましたが、それらの色設定部分。WEBサイトのブランドカラーによって変更するところですね。@black-50;bosy要素の色とテキストの色。underline;}}リンクの色設定と、aタグの内容。さきほどの@brand-primaryがどのように使われてるかわかりますね。一つの値を変えるだけで、hoverも調整されるように書かれてます。Typography文字周りの変数。サイトに合わせて調整するところですね。@font-family-sans-serif;フォントファミリーの設定。日本人向けに直さないとね。~12pxフォントサイズの設定。見出しの各種サイズなど違う場合は修正が必要。inherit;行間などなど。"glyphicons-halflings-regular";アイコン型Webフォントの設定。5px;Bootstrapが用意してくれてる便利なclassなどで使われる余白や線の値。mixins各種ブラウザに対応、調整するための変数。@box-model;}box-sizingは全部のブラウザでリセットしてるみたい。自動プリフィックス機能ってのがlessにはあるから3.2では使ってないけど、v4までは古いverの為に一応書いてるみたい。@radius;}全部の角を角丸にするミックスインは、もともとブラウザで対応しているので必要ないけども、個別の辺を角丸にするミックスインは、用意してるみたい。@shadow;}ボックスシャドウの設定。4.3、Android4.1以前に対応する場合は、-webkitの行をさっきの使用してないミックスインにかえてね。あとシャドウの色は、なるべくrgpで指定すると奇麗らしい。@transition;}もろもろに対応するためのミックスイン。これもあるけど使ってない。transition、transition-property、transition-delay、transition-duration、transition-timing-function、transition-timing-function、transition-transformを調整する必要があれば指定する。あるけど使ってなーい。@direction;}アニメーションのミックスイン。あるけど使ってな~い。~"alpha(opacity=@{opacity-ie})";}不透明度の設定。IE8のためにfilterをつかった記述がありますね。Chrome}主に、フォーム要素の代替テキスト。入力フォームの中にうっすら灰色のテキストで入力例が表示されてたりするヤツのことね。@gap;}cssでカラムを作る。column-widthで列幅、column-countで列数、column-gapでカラムの間隔。