CSSとは
CSSとはHTMLで作った骨組みを装飾してページを整える言語です。
HTMLではファイル名の末尾に.htmlと付けましたが
CSSでは末尾に.cssを付けることでCSSを作成することができます。
作成したCSSファイルをHTMLに読み込ませるには
HTMLファイルのheadタグ内にCSSファイルの情報を記述する必要があります。
<head>
< link rel="stylesheet" href="style.css" >
</head>
headタグ内にlink要素を記述します。
link要素に、rel属性とhref属性を記述することによって読み込ませることができるようになります。
relはlinkタグが書かれているファイルとhrefに記述されているファイルとの関係性を示します。
hrefはファイルのURLを示しています。
p { color: red; }
pの部分をセレクタ、colorの部分をプロパティ、redの部分を値と言います。
セレクタは適用する場所。プロパティはどのような適用をするか、値はどのくらい適用するかを決定します。
-
classとidについて
HTMLの要素にはclassとidを設定することができます。
同じp要素でも別のプロパティをあてたい時に使います。
classは同じHTMLファイル内で何度も同じ名前を使用することができます。
それに対してidはHTMLファイル内で１度しか使うことができません。
なぜclassとidで分けられているかと言うとコードを読んだ時に明示的に確認することができるためです。
CSSファイルではclassは . idは #で表現します。
<p class="box1">あああ</p>
<p id="circle">いいい</p>
.box1 {
color: red;
}
#circle {
color: blue;
}