テーブルについて - 33歳主婦プログラマーを目指す

本日の教材動画はこちら

＜テーブル＞について

テーブルは、「行」と「セル」でできた表の事。一番馴染みがありそうなのはExcelですかね？Excelの表をプログラムの力で表現するのがテーブルである。

昔HPを自作してた頃はテーブルに頼りまくったデザインをしてたんですが、今はデザインにテーブルを使ってはいけないという暗黙のルールがあるらしい。なんでだ？て思って調べてみたところ、暗黙のルールの出所はわからなかったが、そもそも昔と今とじゃテーブルに使える属性が大幅に違うとのこと。

テーブルタグに色々くっつけてデザインするってこと自体ができなくなったため、テーブルタグのみでデザインするなって言われてるんでしょうかね？（aling属性や縦・横の高さ指定などをCSSのみで指定するようになった模様）

＜行＞タグ

行は横一列のことで、１つのデータの塊（横一列で1つの塊）を示す。タグは＜tr＞＜/tr＞で、下記のセルタグと組み合わせて使う。trタグ1つ＝横1列を示し、trタグを増やせば横の行が増えていく（Excelでいうと列が増えていく）。ちなみにtrは「テーブルレコード」の略らしい。へ～！

＜セル＞タグ

セルは１つのデータ、マス目の事を示す。タグは＜td＞＜/td＞で、上の行タグの中に入れて使う。tdタグ１つ＝1マスを示し、tdタグを増やせば横にマス目が増えていく（Excelでいうと列が増えていく）。trタグの中にいくついれてもいい。ちなみにこっちは「テーブルデータ」の略らしい

＜ヘッダー＞タグ

セルタグにはもう一つあり、それがテーブルヘッダーといわれる＜th＞＜/th＞タグである。この列はこのデータのこと！とわかりやすくするためにつけるタグであり、縦列のタイトルになる。また、thタグは特に指定しなくてもタグ内の文字は勝手に太字で表示されるようになる。使い方はtrタグの中に＜th＞〇〇＜/th＞。