CSS(Cascading Style Sheets)とは、HTMLで作成した文章構造等に対して装飾を加える言語です。スタイルシートは、文章に対して装飾を行いデザイン性の高い見栄えにするためのファイル及びデータのことです。CSSは、スタイルシートの一種であり、主にWebページのスタイルシートを指します。
一般的に、HTMLは文章構造を定義するファイルです。例えば、レイアウトを設定し、その中に見出しやテキスト、リンク、画像などを挿入し、Webページの全体構造を決めます。しかし、そのままの状態では素っ気ないページになってしまうため、CSSを使用してレイアウトやテキスト、リンクなどに装飾を加えるのです。例えば、テキストを赤色にしたり、レイアウトのサイズを指定したりすることもできます。また、リンクをボタンに見せたり、おしゃれな見出しにデザインしたりすることも可能です。文字の色やサイズ、行間、背景色、角丸、余白の調整などは、すべてCSSによって実現されています。
CSSは、セレクタを指定し、プロパティに対して値を設定するのが基本的な書式です。セレクタは、HTMLで使用する要素やid、クラスを指定します。プロパティはCSSのスタイルの種類のことで、widthやbackground、color、borderなど複数のものがあり、装飾したい内容に合わせて記述するのが一般的です。また、そのプロパティに対して値を設定し、どのように変更するのかを決めます。例えば、widthに対して480pxを設定すると、横幅を480pxに変更することが可能です。基本的なCSSの書き方は下記の通りになります。
【基本書式】
セレクタ {
プロパティ:値;
}
【例】
div {
width:480px;
}
CSSはHTMLのタグでスタイルを指定して設定することもできます。実際に、CSSが存在しない頃は、文字の色などをHTMLの中で設定していました。そのため、CSSの必要性をうまく感じられない方もいるかもしれません。しかし、すべてHTMLの中で記述していると変更を加えたいときに修正がしづらいです。また、複数のタグにCSSを適用させたい場合、タグにその都度スタイルを指定する必要があり、利便性に欠けます。CSSを使用することで、このような課題を解決することができるため、現在ではCSSを使用していないWebページはないといえるほど、多くのサイトで使用されている言語です。
