外部に独立したCSSファイルを作って「呼び出す」
HTMLファイルを軽くする為に、外に出せるものは全部出してしまいましょう。
HTMLの他にcss専用ファイルを作成して、cssだけを書いておき、HTMLとリンクさせる方法を使えば、さらにHTMLがスッキリします！
まず、フォルダ内の、index.htmlと同じ場所（同じ階層）に「style.css」という名前のファイルを作成します。
（メモ帳などのエディタを開き、保存場所を選んで、style.cssという名前で保存すればOK）
前回の文字やレイアウトをCSS化する理由と同じ例だと下記のようになります。@charset "shift_jis";
.red {
font-weight:bold; /*太字*/
color:#ff0000; /*赤色*/
font-size:1.5em; /*文字サイズ1．5倍*/
text-align:center; /*中央寄せ*/;
となります。
外部CSSの場合は、CSSだけを書くので<style type=”text/css”>という宣言文は不要です。
代わりにCSS用の文字コード宣言を書きます。
CSSファイル内の文字が半角英数だけの場合は、文字コード宣言があってもなくても、違いが分からないかもしれませんが、コメント部分やフォント指定で日本語を使っていたりしますが、外部CSSが上手く読み込めない場合には文字コード指定が書かれていないだけという事も。
W3Cでも決められている仕様なので忘れずに書いておくようにしましょう。
CSSの文字コード指定は、CSSファイルの一番初めの行に下記のいずれか１つを追加すればOK。
@charset "shift_jis"; /*文字コードがShift_JISの場合*/@charset "euc-jp"; /*文字コードがEUC-JPの場合*/@charset "utf-8"; /*文字コードがutf-8の場合*/
ウィンドウズのテキストエディタ（メモ帳など）で文字を書いて保存するとShift_JIS（シフト ジス）になっているかと思いますが、このように、作成して保存するときに「文字コード」は大抵、自動的に設定されています。
詳しく書くとややこしくなるので書きませんが、
CGIファイルなどはEUCが多かったりします。
最近はUTF-8も増えてます。
ダウンロードしたテンプレートやCGIファイルなどを開く場合に、文字コードが違って文字化けする事が多いので、メモ帳ではなくもう少し高性能なテキストエディタを使用する事をおススメします。
