まず、はじめにCSSとは何か理解しましょう。CSSとは簡単にいえば『レイアウトを定義する』ということができます。HTMLと違う部分は、HTMLは文章の論理的な構造を示す言語であり、CSSのように表現を指定するための言語ではありません。
CSSはHTMLと同じようにメモ帳で作成していきます。CSSではHTMLのようなひな型は必要なく、そのまま宣言のみ入力しています。HTMLと同様に書式があるので、まずは書式を理解しましょう。
CSSの書式
宣言 | |||||
---|---|---|---|---|---|
h1 | { | color | : | green | } |
セレクタ | プロパティ | 値 |
セレクタに基本タグを入力し、{}内のプロパティと値には変更したい内容を入力します。この場合だと、プロパティに色変更のcolor、値に色指定のgreenが入っているので<h1>で入力した文字は緑色に変更されます。
このようにCSSを入力していきます。しかし、これだけではもちろん表示されません。CSSファイルを反映させるにはHTMLファイルに指定する必要があります。では、以前学んだひな型をみてください。
ひな型
ひな型に<link rel="stylesheet" type="text/css" href="style.css">があります。style.cssのところにCSSのファイル名を入れることによって反映されるようになります。