スタイルシートリファレンス > table-layout

スタイルシートリファレンス table-layout


table-layout テーブルのレイアウト方法を指定する (IE5/N6)

テーブルのレイアウト方法を指定します。

auto
自動:規定値
fixed
固定

▲ページ先頭へ

使用例 table-layout

HTMLソース

<html>
<head>
<title>CSS テスト</title>
<style type="text/css">
<!--
.smp1 {
width: 250px;
table-layout: auto;
}
.smp2 {
width: 250px;
table-layout: fixed;
}
-->
</style>
</head>
<body>
auto
<table border="1" class="smp1">
<tr>
<td>1</td><td>このように</td><td>表示されます。</td>
</tr>
<tr>
<td>2</td><td>このように</td><td>表示されます。</td>
</tr>
</table>
<br>
fixed
<table border="1" class="smp2">
<tr>
<td>1</td><td>このように</td><td>表示されます。</td>
</tr>
<tr>
<td>2</td><td>このように</td><td>表示されます。</td>
</tr>
</table>
</body>
</html>

▲ページ先頭へ

ブラウザ上の表示


table-layout:auto;

このように表示されます。
このように表示されます。

table-layout:fixed;

このように表示されます。
このように表示されます。

▲ページ先頭へ

関連項目【テーブル】

table-layout
テーブルのレイアウト方法を指定する
border-collapse
ボーダーの表示仕方を指定する
border-spacing
ボーダーの間隔を指定する
caption-side
テーブルのキャプションの位置を指定する
empty-cells
空白セルのボーダーの表示・非表示を指定する

▲ページ先頭へ

スタイルシートリファレンス > table-layout