項 目 | 説 明 |
---|---|
記述形式 | セレクタ {table-layout: 値 } |
値 の形式 | auto,fixed,inherit |
初 期 値 | auto |
対応ブラウザー | C2+ / e5+ / N6+ / Fx1+ / Op3.5+ / Ch1+ / Sa1+ |
適用可能な要素 | <table> |
継 承 | しない |
table-layoutプロパティ は,テーブル(表)の表示方法を指定 します。
指定できる値の形式は,以下のとおりです。
値 | 説 明 |
---|---|
auto | セルの幅や高さ等の自動調整を行う表示方法を使用します。 (初期値) |
fixed | セルの幅や高さ等はユーザーの指定どおりに固定して表示します。 |
inherit | 親要素の設定を継承します。 |
HTMLソース | |
---|---|
CSS <head> ~ </head> |
<style type="text/css"> <!-- table{ border-width: 1px; border-style: solid; border-collapse: separate; width: 400px; } #tb_auto{ table-layout: auto; margin-bottom: 20px; } #tb_fixed{ table-layout: fixed; } tr, th, td{ border-width:1px; border-style: solid; } th{ width: 5%; } --> </style> |
HTML <body> ~ </body> |
<table id="tb_auto"> <caption>例1. table-layout プロパティが <b>auto</b> の場合</caption> <tr> <th>値の形式</th> <td><b>top</b> | <b>bottom</b> | <b>inherit</b></td> </tr> <tr> <th>初期値</th> <td><b>top</b></td> </tr> </table> <table id="tb_fixed"> <caption>例2. table-layout プロパティが <b>fixed</b> の場合</caption> <tr> <th>値の形式</th> <td><b>top</b> | <b>bottom</b> | <b>inherit</b></td> </tr> <tr> <th>初期値</th> <td><b>top</b></td> </tr> </table> |
ブラウザー 表示例 | ||||||||
---|---|---|---|---|---|---|---|---|
|