Bootstrapとadjustの組み合わせでできるテキストスタイルコンポーネント集

Bootstrapには特有のスタイルの書き方があり、いずれも覚える、あるいはメモしておくだけですぐに使えるものが多いのが特長です。主なのものは下記日本語リファレンスのコンポーネントを参照。

Bootstrap3 日本語リファレンス

テキストカラー

サンプルテキスト。Sample Text. txtRed

サンプルテキスト。Sample Text. txtRed_o 旧txtRed

サンプルテキスト。Sample Text. txtPink

サンプルテキスト。Sample Text. txtBlue

サンプルテキスト。Sample Text. txtLtBlue

サンプルテキスト。Sample Text. txtDkblue

サンプルテキスト。Sample Text. txtOrng

サンプルテキスト。Sample Text. txtGrn

サンプルテキスト。Sample Text. txtWht

※bootstrapで用意されているデフォルトカラーは下記。

text-primary

text-success

text-info

text-warning

text-danger

bg-primary

bg-success

bg-info

bg-warning

bg-danger

当サイト内でのボタンclass。

要素の揃え方

テキストの左・中央・右寄せ

p class=”text-left” bootstrap 固有クラス

p class=”txtAl_L” adjust.cssに書かれたクラス

p class=”text-center” bootstrap 固有クラス

p class=”txtAl_C” adjust.cssに書かれたクラス

p class=”text-right” bootstrap 固有クラス

p class=”txtAl_R” adjust.cssに書かれたクラス

ブロックコンテンツの左・中央・右寄せ

img classに.pull-left

img classに.center-block

img classに.pull-right

更新情報や価格リスト等に便利 pやliをinline-blockで横並びにして、width指定を合わせることで各要素を揃える方法