ウェブデザインA 第08回

ウェブデザインA 第08回

2024年11月22日 /最終更新:2024年11月22日

「id・class」「ブロック」と「入れ子」「margin」と「padding」について解説します。

ウェブデザインA 第08回

まずはスマホ出席で出席登録を行ってください。
今回の4桁の認証コードは「 」です。
また「Visual Studio Code」 を起動しておきましょう。

前回は、「ブラウザ幅」と「コンテンツ幅」「インライン要素」と「ブロック要素」について解説しました。

今回は「id・class」についてとその記述方法「ブロック」と「入れ子」
そしてどうしても覚えてほしい「margin」と「padding」について解説します。

htmlタグの名前(識別子)「id・class」とは

まずは「id・class」から解説を行いましょう。
以下の記事をCtrl + クリックください。

[コーディングの基礎]「id」と「class」

次回以降、mainタグではさらに入れ子の構造を作っていきます。

「ブロック」と「入れ子」の原理

次に「ブロック」と「入れ子」の原理の解説を行いましょう。
以下の記事をCtrl + クリックください。

[コーディングの基礎] ブロックと入れ子

どうしても覚えてほしいプロパティ!「margin」と「padding」

コーディング開始前から「margin」および「padding」はたびたび出てきていますが、
この二つのプロパティは必ず理解をしておかないと適切なコーディングは不可能だと考えてください。
以下の記事をCtrl + クリックください。

[コーディングの基礎]「margin」と「padding」

Webサイトコーディング[EASY]
headerタグのhtml・cssコーディング

それでは今日のコーディングを始めていきましょう。
以下の記事をCtrl + クリックください。

[コーディングの実践:EASY] 03 header編

次回はfooterおよびmainタグのコーディング

今回はここまで。
次回はfooterおよびmainタグのコーディングを行います。