Bootstrapでテーブルをデザインする

Bootstrapでテーブルのデザインをするときは、tableのclassに”table”と記述します。
参考ページ：Tables

<table class="table">
.....
</table>

ストライプ

行ごとにストライプ（縞）模様にするには、classに”table-striped”を追加します。

<table class="table table-striped">
</table>

ボーダーにラインを入れる

テーブルとセルのボーダーにラインを入れるには、classに”table-bordered”を追加します。

<table class="table table-bordered">
.....
</table>

ホバー（hover）表示させる

マウスのカーソルを合わせるとホバー（hover）するには、classに”table-hover”を追加します。

<table class="table table-hover">
...
</table>

セルの余白をカットするには、classに”table-condensed”を追加します。

<table class="table table-condensed">
...
</table>

• floatを使った子要素に合わせて親要素を高さを高くする（揃える）方法
• CSSで画像（の回り込み）とテキストを上で揃える
• Bootstrapでドロップダウンメニューを作成する
• Bootstrapでサムネイルを作成する
• Bootstrapで画像のスタイルを変更する
• Bootstrapでページネーション（ページャー）を作成する
• Bootstrapでパンくずリストを作成する
• Bootstrapでナビゲーションを作成する