67

以下が私のウェブサイトのディレクトリ構造だとしましょう： DIRの構造

今では、index.html次のような画像を簡単に参照できます。

<img src="./images/logo.png">

しかし、私はから同じ画像を参照したいと思いsub.htmlます。何をすべきsrcですか？

4

7 に答える 7

95

../images/logo.png1つのフォルダに戻ります。

../../images/logo.png2つのフォルダに戻ります。

/images/logo.pngどこにいてもルートフォルダに戻ります/。

于 2010-09-07T00:42:51.260 に答える
90

相対パスを使用して画像を参照できます。

<img src="../images/logo.png">
          __ ______ ________
          |    |       |
          |    |       |___ 3. Get the file named "logo.png"
          |    |
          |    |___ 2. Go inside "images/" subdirectory
          | 
          | 
          |____ 1. Go one level up

または、絶対パスを使用できます。/これはサーバー上の絶対パスであることを意味します。したがって、サーバーがhttps://example.org//images/logo.pngにある場合、任意のページからの参照はhttps://example.org/images/を指します。 logo.png

<img src="/images/logo.png">
          |______ ________
          |    |       |
          |    |       |___ 3. Get the file named "logo.png"
          |    |
          |    |___ 2. Go inside "images/" subdirectory
          | 
          | 
          |____ 1. Go to the root folder
于 2010-09-07T00:42:10.007 に答える
12

相対的な参照は

<img src="../images/logo.png">

サーバーのルートを基準にした場所がわかっている場合は、ネストされたディレクトリ階層が複雑なアプリの場合、これが最も簡単な方法である可能性があります。これは、すべてのフォルダーで同じです。

たとえば、質問に示されているディレクトリツリーがサーバーのルートに関連している場合、index.htmlとsub_folder/sub.htmlの両方で次のものが使用されます。

<img src="/images/logo.png">

代わりに、imagesフォルダーがfooサーバールートの下のようなアプリケーションのルートにある場合（eg http://www.example.com/foo）、index.html（http://www.example.com/foo/index.html）egとsub_folder / sub.html（http://www.example.com/foo/sub_folder/sub.html）は両方とも以下を使用します。

<img src="/foo/images/logo.png">
于 2010-09-07T00:50:47.000 に答える
4

あなたのindex.htmlはただ行うことができsrc="images/logo.png"、sub.htmlからあなたはするでしょうsrc="../images/logo.png"

于 2010-09-07T00:42:18.833 に答える
2

../ディレクトリツリーの1つ上のフォルダに移動します。次に、適切なフォルダとその内容を選択します。

../images/logo.png
于 2015-06-25T10:36:33.570 に答える
0

サーバーにファイルをアップロードするときは注意してください。次のファイル構造がある場合、画像がWebページに表示されず、クラッシュしたアイコンが表示されます。これは、ファイルパスが適切に配置またはコード化されていないことを意味します。次のようになりますファイル構造：-> web（メインフォルダ）-> images（サブフォルダ）-> logo.png（サブフォルダの画像）上記のコードは以下のとおりですこの標準に従います 

 <img src="../images/logo.jpg" alt="image1" width="50px" height="50px">

フォルダーを作成せずにファイル構造を無視してファイルをWebサーバーにアップロードした場合、ファイルを直接アップロードすると、画像が壊れて画像が表示されなくなり、コードを次のように変更します。

 <img src="images/logo.jpg" alt="image1" width="50px" height="50px">

ありがとう->vamshikrishnan

于 2016-12-03T05:29:20.017 に答える
0

サーバーにファイルをアップロードするときは注意してください。次のファイル構造がある場合、画像がWebページに表示されず、クラッシュしたアイコンが表示されます。これは、ファイルパスが適切に配置またはコード化されていないことを意味します。次のようになりますファイル構造：-> web（メインフォルダ）-> images（サブフォルダ）-> logo.png（サブフォルダの画像）上記のコードは以下のとおりですこの標準に従います

<img src="../images/logo.jpg" alt="image1" width="50px" height="50px">

フォルダーを作成せずにファイル構造を無視してファイルをWebサーバーにアップロードした場合、ファイルを直接アップロードすると、画像が壊れて画像が表示されなくなり、コードを次のように変更します。

<img src="images/logo.jpg" alt="image1" width="50px" height="50px">

ありがとう->vamshikrishnan

于 2016-12-03T05:32:50.170 に答える