外部CSSが反映されない。

Question

前提・実現したいこと

HPの修正案件でつまずいています。
クライアント側では反映されているらしいのですが、私の方だけ外部CSSが反映されません。
ファイル階層は以下の通りです。

products
└box
├ css
│　└ index.css
└ index.html

わかり辛くなってしまったのですがboxの下にcssフォルダとindex.htmlがあるという構成です。

該当のソースコード

  <link rel="stylesheet" type="text/css" href="/products/box/css/index.css" />

試したこと

css/index.cssにすれば読みました。
しかし、この案件では/productsから始まるパスで送られてきてクライアント側ではそれでみれているみたいです。
/productsから始まるパスでどうすればindex.cssを読みこめますか？

補足情報

productsフォルダは差分で頂いたので、productsフォルダと同じ階層に他のフォルダもあります。

Comments

[m.ts10806]

マークダウンのcode機能使えば冒頭スペースも除去されないので階層も見せやすくなります。
さいあく画像でも良いです

[退会済みユーザー]

この質問は解決されていないという事でよろしいでしょうか？

もしも、解決済みならば解決済みにしてください。

Answer 1

/ から始まるパス指定は、
サーバー上のサイトルート用の絶対パスなので、
基本的にローカルPC環境においてそのままで正しく反映されないのは正常な動作です。

ローカル環境で反映させるには、

・XAMPP や node.js 等でローカルサーバーをたててlocalhostで確認
・DreamWeaverなどの擬似的なルートディレクトリ設定が可能なソフトを介して確認

等の方法で可能です。

この辺の操作・方法がハードルが高いのであれば、
自身のWebサーバーにFTPでアップロードして毎回確認するのが手っ取り早いです。

Answer 2

  <link rel="stylesheet" type="text/css" href="../products/css/index.css" />
  <link rel="stylesheet" type="text/css" href="/products/css/index.css" />

Comments

[kyoya0819]

productsから始めることはできないのでは？

[m.ts10806]

/products
なら一応できます。
始めの/によってWebRootが指定されますので絶対パスの指定になります。

[kyoya0819]

ご指摘ありがとうございます。rootなのか微妙だったので上のような表現をしましたが追記しました。

状況と質問文を見るとパスに「box」が入っているのでおそらくそれが原因だと思われます。