Q&A
../ css
のスペースは実際に存在するんでしょうか。気になりました。
HTMLのファイルをブラウザで開いた時は反映されるのですが、LiveServerだと反映されません。以下がCSSの読み込みです。
<link rel=“stylesheet” href=“../css/test.css”><やってみたこと>
パソコンの再起動
LiveServerの再インストール
VSCの再起動
存在しないです。申し訳ありません
../css/test.css
↑これをCtrl+クリックするとどうなりますか？
CSSの編集画面にとびました
https://teratail.com/questions/327066
の質問の人でしょうか。
もしそうなら運営に削除依頼しておいてください。
（なぜ誰の反応待つことなく退会したのか分かりませんけど）
あとVisual Studio Code を質問タグに追加しておいてください。
CSSだけの話ではないですし、CSSをしている人全員がVisual Studio Code利用しているとは限りません（私は利用してません）
回答1件
0
ベストアンサー
VSCodeで開くフォルダーが間違っているためです。
VSCodeの拡張機能「Live Server」は、VSCodeの「フォルダーを開く」(Macでは「開く」)で指定したフォルダーをドキュメントルートとするローカルサーバーを起動します。
おそらく、あなたはHTMLファイルが置かれたフォルダーを直接「フォルダーを開く」で開いており、そうするとLive Serverは、それより上位のフォルダーにアクセスできません。つまり、親フォルダーにあるcssフォルダーにはLive Serverからはアクセスできないため、CSSファイルが読み込まれません。
ローカルなファイルとして閲覧するのであれば、ドキュメントルートは関係ないので、親フォルダーにあるcssフォルダー以下のCSSファイルが読み込まれて使われます。
対策としては、2つ考えられます。
フォルダー構成を変更しないのであれば、「HTMLファイルが置かれているフォルダーの親フォルダー」を、VSCodeの「フォルダーを開く」で開き、その状態でHTMLファイルをエクスプローラーバー(左側のファイル一覧)経由で開きます。
この状態なら、Live Serverは「HTMLファイルが置かれているフォルダーの親フォルダー」をドキュメントルートとして起動するので、そこにあるcssフォルダー以下のファイルも正常にアクセスできます。
もうひとつの対策は、HTMLファイルが置かれているフォルダーにcssフォルダーごと移動させることです。こうすれば、HTMLファイルが置かれているフォルダーを直接「フォルダーで開く」で開いていても、問題なくcssフォルダー以下のファイルにアクセスできます。
投稿2021/03/10 11:39
編集2021/03/10 11:42
総合スコア11990
あなたの回答
tips
プレビュー
