CSSの基本書式を知ろう!

CSSの基本書式は簡単

CSSの基本的な書式は、セレクタ {プロパティ: 値}という形になります。
セレクタというのは、ご存知のように、HTMLの表示方法を決定するものですよね。ウェブページをブラウザで閲覧したときに、ウェブページの文字の色や背景の色、文字の大きさなどを決定しているのがCSSです。
この過程で、ブラウザに対して、HTMLのどの場所であるかを知らせているのが、セレクタなんです。セレクタには、タイプセレクタやユニバーサルセレクタなど複数の種類があるのですが、もっともシンプルなタイプセレクタを例にとって、実際の記述方法を見てみましょう。
h1{ color: #ff0000}という記述は、「h1」という見出しタグを指定して、その色を指示しています。

同じセレクタに複数のプロバティを設定するときの基本書式

1つのセレクタに対して、文字の色や大きさ、文字と文字の間隔などを、複数のプロパティをまとめて設定したいときには、次のような書式になります。
セレクタ {プロパティ: 値; プロパティ: 値; プロパティ: 値;}
思ったより簡単ですよね。このように、;(セミコロン)で、各プロパティを区切りながら、どんどん指定したいプロパティを追加していくだけです。何回か書いているうちに、すぐに覚えることでしょう。一番最後のセミコロンは、書く必要はないのですが、プロパティとプロパティとの間にセミコロンを記述するのを忘れてしまうと、そこでエラーとなってしいます。セミコロンを書く癖をつけるためにも、慣れるまではプロパティの後にセミコロンを書く習慣を付けておくといいですね。