HTML&CSS入門「tableタグを使って表を作ろう」

スポンサーリンク
Pocket
LINEで送る

tableタグは表を作る役割を持っています。

tableタグを使うことでネットショップの商品説明など表形式で見せたい要素を扱うことができます。

tableタグで表を作ってみよう

では実際に作ってみましょう。

<table border=”1″>
  <tr>
    <th>レッスン名</th>
    <th>レッスン料金</th>
  </tr>
  <tr>
    <td>html入門</td>
    <td>100円</td>
  </tr>
  <tr>
    <td>html中級</td>
    <td>200円</td>
  </tr>
  <tr>
    <td>html上級</td>
    <td>300円</td>
  </tr>
</table>

スポンサーリンク

tableタグは表の大枠を表し、その子要素のtr,tdで表の段を組んで行きます。border=”1″で表に枠線がつきます。

trタグは表の行を表します。

tdとthタグは表のセルを表していて、thは見出しという役割があります。しかし、thをtdにしても問題はありません。

これをブラウザで見るとこうなります。

html_lesson6