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


じかいは

余白、枠線をやります。

このブログの人気の投稿

1月26日(木)2コマ目

12月1日(木)2コマ目

2月2日(木)2コマ目