動物園ページのマークアップ

日　時：2023年3月17日 9:30から12:00

参加者：小野寺島大関大野青木池田藤本

内　容：各自のzoo.htmlページの用のヘッダー像を作成した後、レイアウトのマークアップをしました。

header用の画像をStable Diffusionで生成し、PhotoScape Xで加工。
<body >の直下に <div class="wrapper" >を挿入。
</div >を </body >の直前に移動。
<div class="wrapper" >の直下に「header」要素を挿入。
「header」要素に上記1で作成したヘッド画像を挿入。
</header >の直下に nav 要素を挿入。
</nav >の直下に <main >を挿入。
最終の </div >の直前に </main >を移動。
styleホルダーにodekake.cssを作成。
odekake.cssでページ幅を720pxにし中央揃えにする
@charset
"UTF-8";
.wrapper{
　width: 720px;
　margin: 0 auto;
}
head要素にodekake.cssを呼び込むリンクを記載。
<link rel="stylesheet" href="../style/odekake.css" />
「ChatGPT」でナビゲーション用のコードを生成。
HTMLを当サイト用に書き換え（リンク先とそのURL）
上記をnav要素に貼り付け
上記12で得られたCSSをodekake.cssに貼り付け
リンクの動作確認

zoo.html以外のページについても同様に処理する（宿題）。