ウェブデザインA 第07回

ウェブデザインA 第07回

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

「ブラウザ幅」と「コンテンツ幅」、「インライン要素」と「ブロック要素」について説明を行います。

ウェブデザインA 第07回

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

前回は、<header>から<footer>までの役割、それぞれのhtmlタグのhtmlへの記述方法について説明を行いました。
どのブロックがどの役割のhtmlタグに対応しているのかをしっかり身につけておいてください。

[コーディングの基礎] htmlでそれぞれのブロックに使う各要素の説明

今回は、htmlタグを記述する上で理解が必要な「ブラウザ幅」と「コンテンツ幅」「インライン要素」「ブロック要素」について説明を行います。
さらにコーディングではhtmlタグ・bodyタグの全体設定と、headerタグのhtmlタグを追加していきます。

今回の講義では聞きなれない言葉も出てきます。

ブラウザ幅とコンテンツ幅

まずは「ブラウザ幅」と「コンテンツ幅」に関して解説を行います。
以下の記事をCtrl + クリックください。

[コーディングの基礎] ブラウザ幅とコンテンツ幅

インライン要素とブロック要素

次に「インライン要素」と「ブロック要素」に関して解説を行います。
以下の記事をCtrl + クリックください。

[コーディングの基礎] インライン要素とブロック要素

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

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

[コーディングの実践:EASY] 01 準備・確認編

[コーディングの実践:EASY] 02 html・body編

次回はheaderタグ・footerタグのコーディング

今回はここまで。
次回はページの最上部にあるheaderタグと最下部にあるfooterタグのコーディングを行いましょう。
この順番にするには理由がありますが、次回お話ししようと思います。