〈勉強ログ〉CSSの基本

おはようございます！ひかりうみです★
今日も爽やかな朝ですね！

通勤時間に動画を見ながら勉強中です。

本日からCSSの基本に入ります★

○ひかりうみ　note○

(1)　CSSはHTMLのデザインを詳細に設定するもの

　　ファイル名は "XXXX.css" 拡張子がcss。

　　CSS  :  Cascading Style Sheet（階層式のスタイルシート）

(2)　CSSの書き方とHTMLとの関係性

　　 h1　=　セレクタ（何の要素に）
　　color　=　プロパティ（何を）
　　red　=　値（どのように）

(3)　１つのセレクタに対して、複数のプロパティを設定することができる。文字であれば、1.色　2.文字サイズ　など。

　　h1 {color:blue; font-size: 14px;}

　　プロパティと値の間は「：」、値の後には「；」をつける。

(4)　CSSは半角であれば、スペース、改行、tabは、要素や括弧の間に自由に入れても良いし、入れなくても良い

　　※ただし、最後の；と｝の間は改行を入れてはいけない

(5)　CSSのHTMLへの反映方法
　　a. 外部リンク式
　　→HTMLのヘッダー部分にCSSをリンクさせる。ウェブページ全体に統一したスタイルを適用させることができる。CSSさえ変更すれば、すべてのHTMLへのデザインが変更できる。よく使われる方法。

　　b.埋め込み式
　　→HTMLのヘッダー部分に直接CSSを書き込む方法。該当ページだけデザインを変更する場合に有効。

　　c.インライン式（非推奨）
　　→ボディにHTMLと一緒に記述する。複雑になるためオススメしない。

○ひかりうみ　コメント○

CSSの構造については理解ができました。
ウェブページを見ると、素敵なデザイン沢山あるけれど全部CSSで設定されてるのかと思うと、凄いなと素直に感じます！

また新しいことがしれてドキドキです！

実際にCSSを書いて思ったのは、HTMLに慣れていたので、

つい、プロパティと値の間を「＝」にしてしまうということです。

手が勝手に動いてしまいます…。

20/05/09追記＆修正：

上部の解説部分を一部修正しました。