HTMLからCSS等の外部ファイルが読み込めない場合に確認すること | じょるブログ

じょるブログ

現役理系大学生による大学生に向けた情報サイト

HTMLからCSS等の外部ファイルが読み込めない場合に確認すること

投稿日:

  

実行環境

  • HTML
  • CSS

 

症状

HTMLに以下のように記載し、

<link rel="stylesheet" href="/data/www/sample.css">

CSSファイルを読み込もうとしても、読み込むことができない。

また、同様に画像ファイルなどを読み込もうとして、

<img src="/data/www/image.png">

と記載しても画像が表示されない。

  

原因1

絶対パスで記載している場合に、URLではなくパスで記載している。

  

対処法1

http://やhttps://から始まるURLの記載方法で記載する。

/root/data/www/wp-wordoress/などのようなパスの記載方法ではダメ。

例:

<link rel="stylesheet" href="https://jorublog.site/wp-content/theme/abc/sample.css">
<img src="https://jorublog.site/wp-content/uploads/image.png">

  

原因2

パスの区切りの書き方が\ではなく/になっている。

  

対処法2

/を\に変換する。

例:

./aaa/bbb.png  =>  .\aaa\bbb.png 

  

原因3

拡張子が違う

  

対処法3

正しい拡張子に変更する。

例:pngファイルなのにjpgにしている。

.\aaa\bbb.jpg   =>  .\aaa\bbb.png

google ads




google ads




-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


関連記事

大学生の電子工作 スマートリモコン(プログラム)

この記事ではスマートリモコンを作ってみたで紹介したスマートリモコンのプログラムを記載していきます。回路はスマートリモコン(回路)に記載してあります。今回作成するプログラムは以下の4つです。 (LED点 …

大学生の電子工作 スマートリモコン(回路)

この記事ではスマートリモコンを作ってみたで作成したスマートリモコンの回路について記載していきます。今回作成したスマートリモコンの回路は、 以下の3つからなっています。 赤外線学習回路 赤外線発信回路( …

beebotteでSSL Errorが発生する原因と解決方法

   家で稼働させていた自作のスマートロックとスマートリモコンが昨日から突然動作しなくなってしまいました。 その原因が判明しましたのでここに記載しておきます。     症状 発生した症状としては、be …

windowsでpythonにPyaudioをインストールする際に生じるエラーの原因と解決方法

  私はwindowsのノートパソコンを使用しているのですが、先日pythonで録音や再生を行ったり、音声解析を行うことのできるモジュールであるPyaudioを入れようとした際にエラーが発生し少しつま …

初めての大学生の電子工作 スマートリモコンを作ってみた

 タイトル通り、初めて電子工作をやってみました。電子工作をやったことがないという方にもこの記事を読めば作れるように、つまづいたとこなども丁寧に説明していきます。もしわからないことなどがございましたら気 …




関連記事