【HTML・CSS学習】tableで表作成

おはようございます。

くりnoteの続きで、前回作ったサイトの下層ページを作成しました。その中でtableを使った表を作ろう、という部分がありまして。

ドットインストールでtableの動画を見た時は、なんかごちゃごちゃしていて、よくわかんなかった印象が残ってて、正直、苦手意識みたいなのが薄っすらとありました。

なので最初は、「コピペでいいかな」とか、「サラッと流して次に行こう」とか、「Bootstrapで挿入できるから良いかな」とか逃げを考えていました、が。。。

「それじゃあダメだ、やっぱ一度はやろう！」と、くりnoteで紹介されているサルワカさんのサイトを見ながら真似てコードを書きました。

まずはサルワカさんの説明通りに簡単な表を作ってみて、
次はくりnoteの表を作ってみて、間違ってる部分を直して、
次は、どこかの会社の本物の会社概要ページの表を模写してみました。

結果、ちゃんとできた！！

tableの行の偶数要素だけ背景色が変わっていて、「あ、これは前にドットインストールでやった『:nth-child(even)』だ！」って復習にもなって、やっぱり実際のサイトを見るのは、手を動かす機会が増えて勉強になるんだなって思いました。

出来上がると楽しいですね。良かったです！