HTMLのテーブルサイズ - コード

どのようにして異なるサイズのテーブルを作るのですか?
どのようにしてテーブルコラムのサイズ分割するのですか?

説明

テーブルのサイズ


ピクセル又はパーセンテージに基づいてテーブルのサイズを設定することができます。まず、ピクセルを使ってサイズを設定する方法を説明しましょう。Widthとheightアトリビュート(属性)を使用します。
コード例:
<table border=1 bgcolor="green" width=300 height=100>
<tr height=30>
<td>
これは1番目の横列、1番目の縦列です
</td>
<td>
これは1番目の横列、2番目の縦列です
</td>
</tr>
<tr height=70>
<td>
これは2番目の横列、1番目の縦列です
</td>
<td background="./test.jpg">
これは2番目の横列、2番目の縦列です <br><br> 素敵な背景ですね
</td>
</tr>
</table>

ここれは、テーブル全体の幅を300、高さを100とし、1番目の横列を30、2番目の横列を70にしました。
結果:
これは1番目の横列、1番目の縦列です これは1番目の横列、2番目の縦列です
これは2番目の横列、1番目の縦列です これは2番目の横列、2番目の縦列です
素敵な背景ですね

パーセンテージを使用したテーブルのサイズ


テーブルの幅と高さはパーセンテージを使用して設定することもできます。
例: width=60%
上記は、現在のコンポーネントの幅に対して60%の幅のテーブルを作成することをア示します。
仮に、body タグの内部にwidth を100%にしてテーブルを設定する場合、テーブルの幅はブラウザーの幅と同じになります。
ひとつのテーブルを他のテーブルの内部に作成することができます。これについては、後で説明しましょう。
コード例:
<table border=1 bgcolor="green" width=80% height=20%>
<tr height=30%>
<td>
これは1番目の横列、1番目の縦列です
</td>
<td>
これは1番目の横列、2番目の縦列です
</td>
</tr>
<tr height=70%>
<td>
これは2番目の横列、1番目の縦列です
</td>
<td background="./test.jpg">
これは2番目の横列、2番目の縦列です <br><br> 素敵な背景ですね
</td>
</tr>
</table>


ここでは、テーブル全体の幅を80%、高さを30%に設定し、1番目の横列の高さを30%、2番目の横列の高さを70%に設定しました。
もう少し詳しく説明すると、コンポーネントのサイズがwidth=500,height=500 の場合、テーブルの幅は500の80%(400)、高さは500の30%(150)となります。そして、そのテーブルの高さ150が30%と70%に分割されるのです。
結果:
これは1番目の横列、1番目の縦列です これは1番目の横列、2番目の縦列です
これは2番目の横列、1番目の縦列です これは2番目の横列、2番目の縦列です
素敵な背景ですね
--