HTML編集方法 表編
このページでは、HTML基本構造を製作した後、様々な装飾をつけていくための編集方法をご紹介
HTMLでは、表を作る事が出来ます。縦や横に区切った表を表示します。 セル(ます目)ごとに、大きさを変更したり、表のデザインを設定したりもできます。
【基本HTML】
<table><tr><td>の3つのタグで組まれます。この3つに行や列、などの設定をしていきます。
|
【タグの説明】 ◆<table>〜</table> ここに表を作ります。 ◆<tr>〜</tr> 表に行を(横列)を作ります。 ◆<td>〜</td> <tr>〜</tr> の中にセルを作ります。 |
width 属性で横幅、 height 属性で高さを指定します。 ただし、高さを指定すると後で行を増やすと行の高さが変わってしまうので注意しましょう。
| ◆HTML <table width="400"height="200"border="1"> <tr> <td> </td> </tr> </table> ※ブラウザでみるとこの表です。 |
【セルの大きさを変更】
| セルの場合も同様にwidth="幅" height="高さ" を <td> タグの中に記述します。 | ◆HTML <table border="1"> <tr> <td width="200" height="100"> </td> <td width="300" height="100"> </td> </tr> </table> |
| ◆HTML <table border="5"> <tr> <td> 枠の太さは5に指定しました </td> </tr> </table> |
※ブラウザではこのように表示されます。 |
【枠のカラーを指定】
枠に色をつける時は半角スペースを空けて bordercolor="色" で色を指定します。
◆HTML
<table border="1" bordercolor="#0000ff">
<tr>
<td> 枠のカラーを青に指定 </td>
</tr>
</table>
◆カラー表
|
背景や文字もカラーを指定することが出来ます。
◆背景 <font color="色の記号">〜</font> 文字の色を変えることができます。 |
