投稿

1月, 2023の投稿を表示しています

1月26日(木)2コマ目

イメージ
今日、やったこと 枠線・余白 今日のホワイトボード 枠線と余白 HTMLの多くのタグには枠線と余白の設定ができます。 余白には 枠線の内側(設定項目名:padding) 枠線の外側(設定項目名:margin) があります。 図 枠線・余白 練習問題1(マンボウ) 正解例をあげておきます。 style.css index.html linkタグでstyle.cssを読み込んでください。  次回は 練習問題の続き(ペンギン)をやってもらいます。

1月19日(木)2コマ目

イメージ
今日、やったこと デザイン設定を別ファイル(style.css)に 今日のホワイトボード タグのID、クラス タグにはID、クラスを指定することができます。 IDは重複NG、クラスは重複OKです。 図 タグにID、クラスを指定する デザイン設定 いままではタグを対象にデザイン設定をしていましたが、デザインは タグ ID クラス  を対象に設定できます。 図 セレクタの違い セレクタは対象がタグ、クラス、IDの場合にそれぞれ指定方法が異なります。 デザインを別ファイル(style.css)に 今まではHTMLファイルに表示内容とデザイン設定をしていました。 1つのWebサイトには複数のHTMLファイルがあります。これらのデザインを各ファイルで指定すると、 同じ設定を複数ファイルで指定する必要がある デザイン変更時の変更作業が大変 になります。 そこで、デザインはHTMLファイルとは別ファイルで設定し、HTMLファイルはデザイン設定ファイルを読み込めば上記の問題点も解消されます。 図 HTMLファイルとデザイン設定ファイル(style.css)を分離 練習5 style.cssファイルを作成する練習問題をやりました。正解例をあげておきます。 style.css 練習6 style.cssファイルを作成する練習問題をやりました。正解例をあげておきます。 style.css じかいは 余白、枠線をやります。