- ベストアンサー
階層の違うディレクトリでのCSSの呼び出し方
- FC2サーバーを利用してPCサイトを制作しており、HIMEISMのテンプレートを使用しています。ディレクトリを分けた際にCSSスタイルシートが正しく呼び出されない問題が発生しています。解決方法を教えてください。
- PCサイト制作にFC2サーバーとHIMEISMのテンプレートを使用しています。ディレクトリを分けた際にCSSスタイルシートの呼び出しがうまくいかない問題が発生しています。解決方法をご教示ください。
- FC2サーバーを使用し、HIMEISMのテンプレートを利用してPCサイトを作成しています。ディレクトリを分けるとCSSスタイルシートの呼び出しがうまくいかなくなる問題があります。解決方法を教えてください。
- sotoya
- お礼率78% (57/73)
- レンタルサーバ・ASP
- 回答数3
- ありがとう数3
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
index.html が、href="img/style.css" なのですから、１つ下の階層に保存したファイルからなら、href="../img/style.css" です。
その他の回答 (2)
階層を分けた場合CSSの位置はフルパスで記載する必要が有ります。 <script src="http://hoge.com/global/nav/scripts/globalnav.js" type="text/javascript" charset="utf-8"></script>
お礼
ありがとうございます！^^
- ORUKA1951
- ベストアンサー率45% (5062/11036)
本来は絶対パスで指定しておけばどこにHTMLを移動してもパスを書き換えなくてよいのですが、その場合ローカルでのテストはできないでしょう。 ローカルでテストする方法もあるのはありますが・・・。絶対パスでの師弟については、今回は説明しません。 ./ カレントディレクトリを指します。(カレントとはそのファイルの存在する階層) これを書かない場合も同じです。 現在表示しているHTMLの場所が hoge.com/novel/sakura/page1.html だとするとカレントは、 hoge.com/novel/sakura/ です。そのHTML内で ./images/photo/abc.jpgと指定してあれば、【ブラウザは】!!大事です!!!は、そのHTMLを完成させるため、hoge.comサーバーに対して /novel/sakura/images/abs.jpgをよこせと請求します。 単に images/photo/abc.jpgでもまったく同じです。 もし、 ../images/photo/abc.jpg と指定してれば、サーバーに対して /novel/images/abs.jpg をよこせといいます。 さらに ../../images/photo/abc.jpg と指定してれば、サーバーに対して /images/abs.jpg をよこせといいます。 ・・・・ウェブサイトを構築する場合、このパス指定はとても重要な基礎知識です。しっかり身につけておきましょう。 ・・・・色々なファイルを散らばらせておくと、先で増えたときワケワカメになります。きちんと整理しましょう。 / |-- index.html |-- images/ | |-- photo | |-- figure |--css/ |--novel | |-- images novel内だけで使用する画像 [ちょっと難しい話] 絶対パスの場合の指定は /novel/sakura/images/abs.jpg と.をつけませんから、そのまま /novel/sakura/images/abs.jpg をよこせと言います。この場合は、そのHTMLがどこに書かれていても、いつもそれを要求しますから、HTMLは【書き換えなくても】どこにでも移動できますね。・・・ですが、色々と面倒くさい高度な設定をしないとローカルではテストできません。 ・サーバーと同じ階層に入れておく hoge.com/anata/があなたのサイトでしたら D:\anata\にいれるか、ローカルサーバーをインストールするか・・
お礼
詳しくありがとうございました!
お礼
素早い反応ありがとうございます！ 分からかったのは勘違いしていたからだということがわかりました…。 色々調べて、何度も../***/style.css"というのをみかけていたんですが、どれも../の..には該当する上の階層のディレクトリの名前が入るんだと思い、上には(Root)しかないぞ…？？と混乱してしまっていました。 そのまま../や.../と打ち込み、下の階層になっていくにしたがって．を増やしていけばいいんですね。 ようやく理解できました。 解決できたと思います。 回答ありがとうございました！ 助かりました！！