Boostrapのテーブル

HTMLテーブルにBoostrapのスタイルを適用は、table要素のclass属性に"table"を指定してやるだけ。

	<table class="table">
		<caption>XXXX</caption>
		<thead><tr><th>関数</th><th>説明</th><th>例</th></tr></thead>
		<tbody>
			<tr><td>XXX</td><td>XXX</td><td>XXX</td></tr>
		</tbody>
	</table>
	

1	けもの	ネコ
2	けもの	ヤギ
3	虫	ノコギリクワガタ
4	虫	タイワンカブト

縦の罫線を表示する場合

<table class="table table-bordered">

1	けもの	ネコ
2	けもの	ヤギ
3	虫	ノコギリクワガタ
4	虫	タイワンカブト

画面サイズを小さくしたとき、スクロールバーを表示させる。

<table class="table table-condensed">

↑画面を小さくするとスクロールバーが表示されます。

若干小さいテーブルにする場合。
paddingの幅が少しだけ狭くなっている

<table class="table table-condensed">

1	けもの	ネコ
2	けもの	ヤギ
3	虫	ノコギリクワガタ
4	虫	タイワンカブト