- 締切済み
CSSがHTMLに反映しない
CSSをはじめて使う者です。XPでIEを使っています。 解説サイトの最も簡単そうなプログラムをコピペし、 HTMLファイルと外部CSSファイルを同じフォルダ（デスクトップにあるtopフォルダ） に入れてHTMLを開いたのですが、CSSを全く読み込まず、HTMLのテキストしか表示されません。 ★HTMLデータ（top.html） ------------------------ <HTML> <HEAD> <link rel=stylesheet type="text/css" href="C:\Documents and Settings\Administrator\デスクトップ\top\top.css"> </HEAD> <BODY> <div class="selecter">文字が赤くなり、左に5pxの罫線が引かれます。</div> </BODY> </HTML> ★CSSデータ（top.css） ------------------------ .selecter { color:#ff0000; border-left:solid 5px #ff9900; } ・他のサイトにはHTMLファイルのstylesheetに""があったので付けてみたのですが、意味なしでした。 ・他のサイトの形が異なるCSSも試したのですが同様の状態だったので、HTMLのHEADの部分が怪しいと思い、ファイル名指定を"top.css"に変えたりしたのですが、意味なしでした。 ・CSSは最初メモ帳で書いたのですが、拡張子がどうしてもCSSになってくれなかった（top.css.txtになる）ので、ワードパッドで書いて保存したら、拡張子は正常にCSSになりました。ただ何故かアイコンが、プログラムが見つからない時に表示される奴になっています…。 スタート地点から躓いていて非常に恐縮なのですが、何卒よろしくお願いいたします。
- みんなの回答 （3）
- 専門家の回答
みんなの回答
- SAYKA
- ベストアンサー率34% (944/2776)
>ワードパッドで書いて保存したら これ、もう一度メモ帳で「見たら」どうなってる？ ワードパッドで見てるのと同じになってるかな？ 変な風になってない？ メモ帳で扱う「.txt」というのは「プレーンテキスト(plain text)」と呼ばれ、ワードパッドはリッチテキストというのに変換してしまう事があるよ。(場合によってはWORDドキュメント) そんでCSSはプレーンテキストでなければならない。 ワードパッドで保存するときにプレーンテキストが選べないようならメモ帳で保存して無理矢理拡張子をcssに戻すしかないね というか テキストエディタを別途探して使った方が良いんじゃないかな。 サクラエディタとかさ。
- buffalomasa
- ベストアンサー率66% (70/106)
まず<div>の部分を <div style="color:#ff0000; border-left:solid 5px #ff9900;">文字が赤くなり、左に5pxの罫線が引かれます。</div> という風に変更して、正常にスタイルが変わることを確認してみて下さい。
補足
ご回答有難うございます。 その場合には、正常にスタイルが変化します。 ただこの形のCSSは以前にも使用したことがあり、今回は外部ファイルで作りたいと考えています。
- koke29
- ベストアンサー率58% (114/196)
<link rel=stylesheet type="text/css" href="C:\Documents and Settings\Administrator\デスクトップ\top\top.css"> ↓ <link rel=stylesheet type="text/css" href="top.css"> にしたら うまくいきませんか？
補足
お答え有難うございます。 仰っておられるファイル名指定の部分は既にそのように試したのですが、同じ状態でした。（CSSはデスクトップの部分から指定しなくてもＯＫなんでしょうか。htmlのときはローカルで画像を指定する際に、最初から指定しないとエラーが出たので、念のため両方試しました） 今もアドバイス欄をコピペしてみたのですが、やはり反映しません…。
お礼
ご回答有難うございます。正常に動作しました。 どの様に保存しようとアイコンは"プログラムが見つからない奴"のままなのですが、サクラエディタで保存するとcssはちゃんと動きました。 多分仰られているように「プレーンテキストでなければならない」という部分で引っ掛かっていたんだと思います。 朝からずっと悩んでいたので、やっと先に進めます。ここで伺って良かったです。本当に有難うございました。