使用方法

CSSの指定方法
次にCSSの指定方法を説明します。

各要素の style属性 に指定することでCSSが適応する方法。
※一番簡単で、かつわかりやすい。ただ、複数個所ある場合、逆に見ずらくなる。
<p style="font-size : 10pt">文章</p>

指定したすべてのセレクタにcssを設定する。
head要素の中でCSSを宣言し、body要素の中で適応されるというものです。style要素を使用します。
このときCSSのタイプを指定しておく必要があります。
style要素の type属性 の属性値を text/css と指定しておきます。
※この指定方法だけでは、body要素内のすべてのp要素にCSSが適応する。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
        <title>
            CSS
        </title>
        <style type="text/css">
            <!--
                p { font-size : 10pt }
             -->
        </style>
    </head>
    <body>
        <p>この部分の文字サイズは10ポイントになります。</p>
    </body>
</html>

個別に、かつ全体にcssを設定する場合1
セレクタを指定するときに #半角英数字の名前 でセレクタを指定するとidを宣言したことになります。
idを宣言し、今度はCSSを適応させたい要素の id属性 で宣言した名前を指定すると、その部分にだけCSSが適応されて便利です。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
        <title></title>
        <style type="text/css">
            <!--
                #aaa { font-size : 10pt }
            -->
        </style>
    </head>
    <body>
        <p id="aaa">この部分の文字サイズは10ポイントになります。</p>
    </body>
</html>

個別に、かつ全体にcssを設定する場合2
#の代わりに
. で宣言し、各要素の class属性 で名前を指定することによって適応することができます。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
        <title></title>
        <style type="text/css">
            <!--
                .aaa { font-size : 10pt }
            -->
        </style>
    </head>
    <body>
        <p class="aaa">この部分の文字サイズは10ポイントになります。</p>
    </body>
</html>


セレクタにはどの要素に対してCSSを適応するかを書いて、 {~} の中にプロパティと値を書きます。
プロパティ・値を複数指定したいときは、 ; (セミコロン)で区切って指定します。
p {
      font-size : 12pt;
      color : red 
  }
最終更新:2009年08月27日 00:07