CSSの適用方法

ページ内にCSSを適用するには、以下の３つの方法がある。

（1)HTML要素の開始タグ内に STYLE属性でスタイル設定する（インラインスタイルシート）
　例<p style="color:red;font-size:18px;font-weight:bold">～</P>

（2)HTMLのhead部分に<style>タグを使いスタイルを設定する。（埋め込み型スタイルシート）
　　<style type="text/css">
　　　　セレクタ　{プロパティ:値}
　　</style>

（3）スタイルを外部 CSSファイルに記述し、そのファイルを読み込む
セレクタ　{プロパティ:値}の形式でスタイルを記述し、拡張子.cssで保存する。
ページのhead部分に<link rel="stylesheet" type="text/css" href="cssファイルのURL">の形で読み込む。

Sample

（１）の例

　（２）の例

　（３）の例

Sample Source......................................................................>>>

<link rel="stylesheet" href="../sample.css" type="text/css">
<style type="text/css">
   p.test1 {width:150px;color:#336699;font-size:80%;border:thin solid navy;}
-->
</style>
</head>

<body>

<p style="color:red;font-size:20px;font-weight:bold">（１）の例</p>
<p class="test1">　（２）の例</p>
<p class="test2">　（３）の例</p>

★外部CSSファイル「sample.css」の内容

@charset   "Shift_JIS";
p.test2 {width:180px;color:#006600;font-size:14pt;background-color:#99ff99}