表の幅の計算方法のレンダリング

 
テーブル(表)
ホーム > CSS2 Note > table-layout > 表の幅の計算方法のレンダリング

固定レイアウト

<style type="text/css"><!--
.eg1 {table-layout:fixed; width:500px;}
--></style>

<table border="1" class="eg1">
<thead>
<tr><th>File Name</th><th>Font Name</th><th>font-family</th><th>文字</th></tr>
</thead>
<tbody>
<tr><td>Arial.ttf</td><td>Arial</td><td>Arial</td><td>Latin</td></tr>
<tr><td>Arialbd.ttf</td><td>Arial Bold</td><td>Arial</td><td>Latin</td></tr>
<tr><td>Ariali.ttf</td><td>Arial Italic</td><td>Arial</td><td>Latin</td></tr>
<tr><td>Arialbi.ttf</td><td>Arial Bold Italic</td><td>Arial</td><td>Latin</td></tr>
</tbody>
</table>
 

自動レイアウト

<style type="text/css"><!--
.eg1 {table-layout:auto;}
--></style>

<table border="1" class="eg1">
<thead>
<tr><th>File Name</th><th>Font Name</th><th>font-family</th><th>文字</th></tr>
</thead>
<tbody>
<tr><td>Arial.ttf</td><td>Arial</td><td>Arial</td><td>Latin</td></tr>
<tr><td>Arialbd.ttf</td><td>Arial Bold</td><td>Arial</td><td>Latin</td></tr>
<tr><td>Ariali.ttf</td><td>Arial Italic</td><td>Arial</td><td>Latin</td></tr>
<tr><td>Arialbi.ttf</td><td>Arial Bold Italic</td><td>Arial</td><td>Latin</td></tr>
</tbody>
</table>
 
関連項目: table-layout
トップページ CSS2 Note ページトップ
 2009/07/01発行 2009/07/01更新