No Programming, No Life

新しいNPNLです。http://d.hatena.ne.jp/fumokmm/ から引っ越してきました。

テーブルのレイアウト

以外とHTMLも奥が深いみたい。

widthを100%で指定してあるテーブルに対して
各td要素のwidthを指定していき、
ひとつだけ指定しなかったりすると、
その指定しなかった要素は
勝手に残りの長さになるようです。

例) 真ん中が自動調整
<table width="100%" border="1">
  <tr>
    <td width="10%">10%</td>
    <td>自動調整</td>
    <td width="10%">10%</td>
  </tr>
</table>

実行例↓







10% 自動調整 10%

例) 自動調整と10%の列が交互に出現
<table width="100%" border="1">
  <tr>
    <td width="10%">10%</td>
    <td>自動調整</td>
    <td width="10%">10%</td>
    <td>自動調整</td>
    <td width="10%">10%</td>
    <td>自動調整</td>
    <td width="10%">10%</td>
  </tr>
</table>

実行例↓











10% 自動調整 10% 自動調整 10% 自動調整 10%

例) 長さを指定しないと間延びする
<table width="100%" border="1">
  <tr>
    <td>自動調整</td>
    <td>自動調整</td>
    <td>自動調整</td>
    <td>自動調整</td>
  </tr>
</table>

実行例↓








自動調整 自動調整 自動調整 自動調整