HTML/CSS基礎② 実践

講義内容

1限目
学科 HTML/CSS基礎②
ファイル管理について

2限目
学科 HTML/CSS基礎②
Webページ制作実践

3限目
学科 HTML/CSS基礎②
Webページ制作実践

4限目
学科 HTML/CSS基礎②
Webページ制作実践

5限目
学科 HTML/CSS基礎②
本日の講義のまとめ

メモ

TeraPadの初期設定

表示＞オプション
・表示の「マーク」をすべてチェック
・基本の「Tab数」を少なめにしておくといい
・文字コードを「UTF-8N」に
・拡張子HTMLの「*.html」だけにする
・ルーラー/行番号　論理行で行番号を表示する。

キーワード設定の記述

教材にないところ

<meta name="keywords" content="花屋,ブーケ,ギフト,ブライダル">

HTMLチェックの仕方

以下のURLでチェック
https://www.htmllint.net/html-lint/htmllint.html#

１．FILEにデータをアップロード
２．DATAを選択、下のほうにスクロールしてHTMLバージョンをHTML5に変更

※以下サイトでもOK
https://validator.w3.org

HTMLの認識

https://html-css.hamaya2020.com/lesson-2.html#L2-5-4

・head
宣言←Unityだと宣言欄

・div
カラムの枠

・body
ヘッダーとかフッターとか込みのページ全部

・main
ページの内容

・header
固定ページとかのヘッダー欄

・footer
固定ページとかのフッター欄

・p
段落

・address
アドレス情報

相対パス

1.同じフォルダ（階層内）にある場合
名前をそのまま

2.1つ上の階層にある場合
1つの階層を意味する「../」を使用してパスを記述します。

3.1つ上の階層にある別のフォルダ内にある場合
「../」で1つ上の階層を指定し、その中のフォルダ、さらにファイル名を指定します。
例　../フォルダ名/ファイル名

4.2つ上の階層にある場合
「../」を2回記載し、「../../」とすることで、2階層上であることを示します。

参考
https://and-engineer.com/articles/Y1fGpxAAAAt07ZlQ

進捗