CSS言語の基礎

HTML言語の主要なタグについては既に学習しました。今度は見た目を整える時です。 テキストの色、サイズ、背景などを変更できるようにしたいものです。 これはCSS言語を使用して行われます。

通常、CSSコマンド（スタイル）は 別々のファイルに保存され、そのファイルは特別なタグを使って サイトのすべてのHTMLページにリンクされます。

このアプローチの利点は、CSSファイルが1つであるのに対して、 HTMLファイルはいくらでも、たとえ千個でも存在できることです。 CSSファイルの一箇所を変更すれば、例えば すべての段落を赤色に変更すると、 その変更は、当該CSSファイルがリンクされている すべての千のHTMLページに適用されます。 非常に便利で迅速です。

スタイルファイルの拡張子は.cssでなければなりません。 このようなファイルをHTMLページにリンクするには、 headタグ内に次のような構造を記述します：

html<link rel="stylesheet" href="fileName.css">

次の例では、HTMLファイルにCSSファイルstyles.cssを リンクしています：

html<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>This is the title</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
    <p>
      This is a paragraph with text.
    </p>
  </body>
</html>