CSSとは

CSSとはwebサイトの見た目を修飾するための言語である。家に例えるとHTMLが骨組みや土台で、CSSが外壁や壁紙などの装飾をあらわしている。

CSSを適用させる3つの方法

1. CSSファイルを読み込ませる（一般的な方法）
2. headタグ内にstyleタグで記述する
3. HTMLタグ内にstyle属性を指定する（部分的に指定したいとき）

2番目と3番目の方法でも指定はできる。ただし、あとから編集したくなったとき、個別で指定した部分を探す手間が発生する。
特別な理由がない限りは1番目の「CSSを読み込ませる方法」で適用させるようにする。

CSSの基礎知識

CSSの基本の書き方

• セレクター：どの部分を装飾するか指定
• プロパティ：なにを変えるかを指定
• 値：どのように変えるかを指定

CSSを書くときのルール

• 半角英数字で書く
• なるべく小文字で書く
• 複数のセレクターを指定するときは「,」で区切る
• プロパティを区切るときは「;」を忘れない
• 要素の中の要素を指定するときは「半角スペース」で区切る

CSSの実例

フォントのサイズ、色、種類の指定

• font-size:30px;
• color: #0bd;
• font-family: serif;

↑上記のCSSをこの文に適用しています。

font-weight プロパティ

この文にもCSSを適用しています。フォントの太さを指定する「font-weight:bold;」を適用。

line-height プロパティ

line-height: 1;

行間を指定するときに使います。
この段落ではline-height: 1;で設定しています。
感覚によって見え方が大きく変わります。

line-height: 1.5;

行間を指定するときに使います。
この段落ではline-height: 1.5;で設定しています。
感覚によって見え方が大きく変わります。

line-height: 2;

行間を指定するときに使います。
この段落ではline-height: 2;で設定しています。
感覚によって見え方が大きく変わります。

text-align プロパティ

テキストを揃える位置を指定します。

text-align: left;

デフォルトではleftになっています。

text-align: center;

この文は中央寄せになっています。

text-align: right;

この文は右寄せになっています。