色を変えたい！文字を真ん中に寄せたい！それは全てcssで解決！

背景色を変えたい、テキストを左寄せ真ん中にしたい、文字サイズを大きくしたいなど、webサイトを作る上で見た目の装飾（スタイル）はつきもの。それらは全てCSSという言語を使用する事で綺麗で格好いいwebサイトにする事ができます。
最近のCSSは非常に優秀で、昔は画像を利用しなければ出来なかった角丸の枠や背景のグラデーション、多角形の図形などもCSSで作る事で出来ちゃいます。
色々な事が出来ちゃうCSS。基本からスタートしていきましょう！

1 cssとは何者？
2 cssの基本的な書き方
3 cssの記述方法には「＜head＞内に記述するcss」と「インラインによるCSS」と「外部css」の3種あります
4 まとめ
5 CSSコーディングのオススメ本

cssとは何者？

そもそもCSSって何の略なのでしょうか。
CSSは正式名「Cascading Style Sheets（カスケーディング・スタイル・シート）」と言い、それぞれの頭文字をとって「CSS（シー・エス・エス）」もしくは「スタイルシート」と呼びます。ワープロソフトなどでも文字サイズを変えたり位置を変えたりする（スタイルを変える・装飾をする）技術全般をスタイルシートと言います。
CSS単体で使用する事はほぼ無く、HTMLと併用する事が殆どです。

HTML→文書構造（検索システムに影響あり）
CSS→見た目のデザイン（ユーザーの印象に影響あり）

「HTML＋CSS＝webサイト！」という構図になっていきます。
HTMLとCSSはwebサイトを作る上で一蓮托生、二人で一人、支え合って存在しています。

cssの基本的な書き方

そうは言っても、具体的にどの様にスタイルを反映させるのでしょうか。
例としてHTMLに記述された文字を赤色にしてみた場合の記述方法です。

HTML

<p>この文字の色を赤くします。</p>

CSS

p{
 color: red;
}

これをブラウザで見てみると・・・

こうなります。
テキスト「p」に対して赤色「color: red;」を指定する事で文字が赤くなりました。
この様にしてスタイルを反映させていきます。

cssの記述方法には「＜head＞内に記述するcss」と「インラインによるCSS」と「外部css」の3種あります

styleタグを＜head＞内に記述する方法

styleタグはHTML内（＜head＞内）に記述する方法です。
直接ページに記述する為、そのページ内全体に反映する事ができます。

styleタグをインラインに記述する方法

インラインとはCSSを当てたいタグに直接記述する方法です。
ピンポイントでCSSを記述するので、その部分にだけ反映します。

外部cssによる記述方法

HTMLファイルとは別にCSS専用ファイルを作り、ページにCSSファイルを読み込む事で使用できる方法です。
外部ファイルから読み込む為、サイト全体に反映する事ができます。
styleタグと違うのは、若干記述ルールが異なるのと、外部にファイルを置く事になりますのでファイル管理が必要となります。

基本的な記述方法はこの3つです。
ではどれがいいのか。。。
使用の仕方にもよりますが、styleタグはあくまでそのページやその部分にしか反映されません。
サイト全体を管理できる外部CSSで制作する事をオススメします。

まとめ

HTMLでは出来なかった「デザイン」を司るのがCSSです。
見た目を綺麗にしユーザーが見やすい自分好みのwebサイトを作っていきましょう！

CSSコーディングのオススメ本

CSS辞典第5版 [CSS2/3/4対応]

本書は、Webデザインに必須の技術「CSS」の文法リファレンスです。大幅改訂となる第5版は、現時点の最新状況を反映し、Web制作を学ぶなら必ず押さえておきたい基本のCSS2.1、仕様の策定とブラウザでの実装が進められているCSS3、さらにはその次の規格であるCSS4(Level4モジュール)まで掲載しています。