階層の違うディレクトリでのCSSの呼び出し方

質問

現在FC2さんにサーバーをお借りしてPCサイトをつくっているものです。
HIMEISM（http://neo-himeism.net/）さんに疑似フレームのテンプレートをお借りして、半分以上はうまくいっているのですが、中身が増えてきたので小説と漫画とイラストをそれぞれ、indexなどより一つ下の階層に分けようとしたのですが、そうすると<link rel="stylesheet" type="text/css" href="img/style.css">としているにも関わらずCSSスタイルシートが呼び出されません。
今は何のディレクトリにも入っていないindexやlink、offなどが一番上の階層にあり、一つ下にスタイルシートやアイコンなどに使う画像が入れられた最初から入っていたimgのディレクトリ、小説、漫画、イラストそれぞれのディレクトリがある状態です。
img以外全部、何のディレクトリにも入れなければ正常に反映されます。

階層を分けたまま、すべてにテンプレートが反映されるようにしたいのですが、どうすればいいでしょうか。

回答No.1

outbrave · ベストアンサー

index.html が、href="img/style.css" なのですから、１つ下の階層に保存したファイルからなら、href="../img/style.css" です。

お礼

素早い反応ありがとうございます！

分からかったのは勘違いしていたからだということがわかりました…。
色々調べて、何度も../***/style.css"というのをみかけていたんですが、どれも../の..には該当する上の階層のディレクトリの名前が入るんだと思い、上には(Root)しかないぞ…？？と混乱してしまっていました。
そのまま../や.../と打ち込み、下の階層になっていくにしたがって．を増やしていけばいいんですね。
ようやく理解できました。

解決できたと思います。
回答ありがとうございました！
助かりました！！

回答No.3

noname#242220

階層を分けた場合CSSの位置はフルパスで記載する必要が有ります。
<script src="http://hoge.com/global/nav/scripts/globalnav.js" type="text/javascript" charset="utf-8"></script>

お礼

ありがとうございます！^^

回答No.2

ORUKA1951

本来は絶対パスで指定しておけばどこに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\にいれるか、ローカルサーバーをインストールするか・・

お礼

詳しくありがとうございました!