CSSとは
CSSとは「Cascading Style Sheets、カスケーディング・スタイル・シート」の略称になります。
主に文字の大きさや色を変える、背景の全体または一部の色を変えたりアニメーションを作ることができます。
HTMLファイルでCSSファイルを読み込むために基本的には以下のように記述します。
linkタグ内のhref=がCSSファイルの名前になります。
CSSファイルの読み込み
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="sample.css">
<title></title>
</head>
<body>
</body>
</html>
HTMLファイルに直接書き込むことも可能ですが、どうしてもコードが長くなったり複雑になってしまうので訂正があった場合に対象の箇所を探すのに時間がかかってしまいます。
それを防ぐためにもCSSファイルを別に作成しCSSのみを記載すればコードもすっきりし見やすくなります。
CSSファイル内の記述
css
h1 {
color : blue
}
CSSの定義は基本的に3つの要素で構成されています。
- h1 = セレクタ (HTML内の要素)
- color = プロパティ (colorなら文字の色、font-sizeなら文字サイズなどたくさんあります。)
- blue = 値 (プロパティをどう変更するのかをしています。)
最後に
セレクタの指定方法、プロパティの種類、値の種類たくさんあります。
CSSを使いこなせばWEB製作の幅が広がり見た人に様々な印象を与えることが可能になります。
色んなプロパティと値を試してみましょう!