締切済み

CSSファイルの作り方

2009/01/15 00:23

市販の書籍を参考にHTMLとCSSの練習を始めたのですが、第一章で早速つまづいてしまいました。書籍には、ファイル名の拡張子を「css」にするとCSSファイルになるとありますが、どうも私のPCではそうはなりません。書籍にはCSSファイルは歯車のついたアイコンで表示されていますが、私のPCではウィンドウのアイコン（認識できないファイルのときのアイコンです）で表示されます。拡張子は「CSS」になっています。 windows上でなにか設定しないとスタイルシートのファイルは認識されないのでしょうか？それともCSSファイルを使用するには、なにか別の特別なものが（ドライバのようなもの）必要なのでしょうか？

Annie0
お礼率13% (6/43)

みんなの回答 （2）
専門家の回答

みんなの回答

Pedophilia
ベストアンサー率71% (383/536)

2009/01/15 15:11 回答No.2

そんなことはないですよ。私は昔から2000年5月からHPを公開して、当初からCSSを使用しているのでXPのIE6でも使えるハズですよ。例えば「a.css」とファイルを作成して中身に TD { COLOR:#FF0000; FONT-FAMILY:'ＭＳゴシック'; FONT-SIZE:12px; BACKGROUND-COLOR:#FFFFCC; HEIGHT: 18px;} .STRK { text-decoration:line-through;} と記述して、HTMLで <META http-equiv="Content-Style-Type" Content="text/css"> <LINK REL="stylesheet" TYPE="text/css" HREF="cssファイルのパス\a.css"> とCSSファイルをインクルードして、HTMLタグに <TD CLSS="STRK">あいう</TD>と記載してHTMLを開いてみてください。文字色が赤で取消線の入ったあいうが表示されませんか? 一応参考HTMLです。a.cssは下記HTMLと同じフォルダにあるので <LINK REL="stylesheet" TYPE="text/css" HREF="./a.css"> と記載しています <META http-equiv="Content-Type" Content="text/html;charset=Shift_JIS"> <META http-equiv="Content-Style-Type" Content="text/css"> <META http-equiv="Content-Script-Type" Content="text/javascript"> <META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML lang="ja"> <HEAD> <LINK REL="stylesheet" TYPE="text/css" HREF="./a.css"> <TITLE lang="ja">おためし</TITLE> <SCRIPT type="text/JavaScript" Language="JavaScript">  </SCRIPT> </HEAD> <BODY> <DIV> <TABLE style="WIDTH: 560px" border="1" cellpadding="2" cellspacing="0"> <TR><TD CLASS="strk">あいう</TD></TR> </TABLE> </DIV> </BODY> </HTML> この場合TDタグの文字色はCSSファイルの TD に定義している COLOR:#FF0000; になるので、ここをCOLOR:#0000FF;としてみたら青文字にかわります。文字色が赤で取消線の入ったあいうが表示されない場合はCSSファイルのパスが間違っているか、CSSやHTMLの定義が間違っています。 CSSを使用したHPをローカルに名前をつけて保存して、参考にしてみるのも手です。 ※ 私のでも良いのですがHP名やURLを記載すると個人情報を記載することになり規約違反になってしまうため記載できません。

Pedophilia
ベストアンサー率71% (383/536)

2009/01/15 01:06 回答No.1

CSSファイルと言うか拡張子がCSSのファイルに関連づけされたデフォルトのアプリケーションがPCにインストールされていないだけだと思います。 →拡張子がbmpのファイルをダブルクリックしたらペイントが開くなどダブルクリックで開くアプリケーションがインストールされていない →確かMSのVisualStudioがインストールされていれば歯車アイコンになったと思いますダブルクリックで開けないだけでHTMLで <LINK REL="stylesheet" TYPE="text/css" HREF="cssファイルのパスとファイル"> と定義してあればブラウザでは問題なく認識されます(有効になります)。私もVisualStudioをインストールしていませんが、CSSやJSはサクラエディタで開くように関連づけしてあるのでサクラエディタのアイコンになっていますが、そのCSSを参照しているHTMLをIE7.0(WinXP)でUpするまえにローカルで表示したり、レンタルサーバにアップしたあとにインターネットで表示しても有効になっています。

質問者