冷蔵庫をwebで表現した現代アートです
見出しを作ろう。はい。というわけでやっていくんですが、前回出した骨組み？みたいなやつあるじゃないですか。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>webサイトだよ！！</title>
</head>
<body>
</body>
</html>
これですね。これのbodyタグで囲まれてるとこにプログラミングしていきます。前回言ったと思うんですけど、このbodyってやつが実際に表示される部分のコードを打ち込むところなんですね。というわけで早速……
<h1>見出しさんだよ！！！</h1>
これだけ。実はわたくし、このタグには見覚えがございます。あれは私が気分でプログラミングを手探りで学んでいた頃……
hタグってのは見出しなのか……ほむほむ、h1,h2,h3……って段々と数字が上がるごとに文字の大きさが小さくなるのか。ほえー。
回想終わり。
なんと私はこれを覚えていたのである！すごいだろう！
いや別にすごくもなんともないのだが、今日の朝ごはん何食べたっけねぇ？とか言ってるような私にしてはよくやった。すごい。
んでまぁさっき回想中に言った通りh1からh6までの見出しのタグが存在し、数字が大きいほど文字のサイズが小さくなる。
私できたよ！ちゃんとコード書けたよ！だがしかし、この程度で満足する私ではない。次に学ぶのはdivというタグである。私の知らないものだ。
いいね、これでこそプログラミングを学んでいるという感じがする。ショートカット機能で出すテンプレートでも一度使ったことのあるタグでもない、未知のものだ。未知を既知にしてこその学びだ。うん。自分でも何言ってるかわかんなくなってきた。
で、divとはなんぞやという話なのだが、簡単に言えばグループを作るタグらしい。例えば、冷蔵庫があるとする。この冷蔵庫がいわばbodyだ。その冷蔵庫には冷蔵室や冷凍室、野菜室といったいくつかの部屋に分かれている。これがいわばdivなのである。divの中にさらにdivを入れることもできる。
どうだろう。わかりやすい例えができたんじゃなかろうか。自画自賛だが。
では早速……
<h1>見出しさんだよ！！！</h1>
<div id="reizo">
</div>
<div id="reito">
</div>
<div id="yasai">
</div>
一旦部屋を建てる。ちなみにidというのは部屋の名前のようなものらしい。つけろと教材さんに言われたのでつけた。何に使うのかは知らん。
次に学ぶタグはheaderとfooterである。その名の通りヘッダーとフッターを作るタグである。いやヘッダーとかフッターって何？しいふは無知であった。ググった。理解した。なのでみなさんもググってください。
<header>
</header>
<h1>見出しさんだよ！！！</h1>
<div id="reizo">
</div>
<div id="reito">
</div>
<div id="yasai">
</div>
<footer>
</footer>
うんうん、いいね。とてもいい。
次に学ぶのはpタグなのだが、これも覚えがある。面倒なので回想シーンは省略するが、文字を打つ段落を作るタグみたいなやつだ。
<div id="reizo">
<h1>冷蔵室</h1>
<p>冷蔵のものを入れるよ</p>
</div>
なんで冷蔵庫なのかはわからない。実際に作ったのは冷蔵庫ではないが、説明用で例を出そうとした結果、冷蔵庫をwebサイトで表現する変な人みたいになってしまった。捉えようによっては現代アートか……？違うな。うん。絶対違う。
さあ、どんどん行こう。次はhrタグ。これは割烹でも使ったことがある気がする。水平線を引くタグだ。これは珍しく</hr>が必要なく、<hr>単体で動くらしい。
次も見覚えがある。imgタグ。画像を挿入するものだ。これも終了のタグはいらないらしい。
<div id="reizo">
<h1>冷蔵室</h1>
<hr>
<p>冷蔵のものを入れるよ</p>
<img src="サイト用画像フォルダ/納豆.png">
<img src="サイト用画像フォルダ/ケチャップ.png">
</div>
ちなみにケチャップライスなのにオムライスにケチャップをかけるのって二重ケチャップじゃないかと友人に言ったらそういう料理なんだよと言われた。解せない。私はマヨる。
まぁそれはどうでもいいのだが。
今回はキリがいいのでここまで！
次回、表やボックスやカードなどの項目を並べる系のタグについて学びます。
エッセイは割とノリで書くので敬体と常体が入り乱れて最初と最後で話し方が変わる現象が起きます。
