Weｂデザイン勉強61日目の成長報告！

こんばんは。

今日の作業は以下です。

【美容院HP】

①メニュー一覧ページのHTML,CSSの記述

②ご予約、お問い合わせフォームのHTML,CSSの記述を行いました。

画像付きで以下で紹介します！

【でき上がったページ】

左側を記述しました

【HTML】

dl dt ddでくるんでHTMLファイルは記述しました。

【CSS】

これは単純な記載でした。

ddの一番下は、マージンが多くなってしまうのでmargin-bottomを0にして調整しました。

【出来上がったページ】

左側を作成しました。（まだCSSは途中）

【HTML1】

フォームの書き方を忘れてましたが、今日また復習できました。

1.formで全体をくるむ

2.table再度くるむ

3.trの中にtdを二つ用意して記述する

tdの二つのデータが関連づいていることを示すために、項目のタイトルをlabelタグでくるんでから、そのlabelタグにはforを追加し、inputタグの中にはid属性（同じアルファベット）を追加することを思い出しました。

また、inputタグの中は必ずid出なくてはいけないと言うわけではなく、class属性でもokと言うことがわかりました。

【CSS2】

こちらは特殊で、forが二つあります。この場合は、よりチェックボックスの意味が近いものでforとidを関連づける必要があることがわかりました。

下の画像だと、一つ目のforは「ご希望メニュー」で、「フォームのメニュー」ということがわかります。二つ目のforは「カット」や「カラー」で、「メニューの中のカットorカラー」ということがわかるので、近いカットやカラーに関連づけていることがわかります。

チェックボックスの場合、チェックボックスを入れることでどの値のチェックボックスかということがわかるようにvalueで日本語で記述をする必要があります。

最後ですが、記入エリアの拡大、縮小ができるテキストエリアは閉じタグがあります。

こちらも復習できてよかったです。

い

【CSS】

CSSはフォーム上部の赤い背景の部分だけやっています。

line-heightの時に動画で「にぶしぶあき」で設定しましょう。って言われたんですが、全く意味がわからずググったんですがこの数値にならなくね？ってなって今日はその部分はスルーしておきました。動画でもするっと言われただけだったので、今回はそのまま進めようと思います。

はい、そんな感じで今日は終わりにしようと思います。

今日は作業がたくさんできました！

おやすみなさい！