img标签在src中不使用相对路径

Question

这不起作用：

<img src="../assets/images/image.jpg" alt="Alternative Text">

但这有效：

<img src="http://localhost/abc/def/geh/assets/images/image.jpg" alt="Alternative Text">

在我的场景中，我无法使用绝对路径。我必须使用相对路径。

Answer 1

“../ assets / images / image.jpg” - 这意味着

1. '../'从我现在的目录
上去
2. 找到'assets /'文件夹
3. 找到'images'文件夹
4. 找到'image.jpg'文件。

该相对链接仅在您的网页位于

的子文件夹中时才有效

“http://localhost/abc/def/geh/”

如果页面的位置确实是

“本地主机/ ASDF / ASDF / ASDF / ASDF / index.php的”

（这看起来很荒谬）要相对地访问资产文件夹，你必须一直到根。

” ../../../../ ABC / DEH / GEH /资产/图像/ image.jpg的;

或者，您可以在head标记中使用基本标记，以使实际src属性中的URL更加友好。

Answer 2

<img src="assets/images/image.jpg" alt="Alternative Text">

应该工作。你不应该把＆＃39; ../'在图像路径的开头。

为了更好地了解相对路径与绝对路径，请参阅this link

Answer 3

我怀疑你实际上并没有按照我的要求去做，所以这里是截图：

如果图片在新标签页中打开，那么您有某种错误或扩展程序会在html中弄乱它。如果你搞砸了相对路径，你很可能得到404，但你能够看到路径是绝对的。 它可能看起来像http://localhost/asdf/asdf/asdf/asdf/assets/assets/image.jpg  无论哪种方式，发送上述操作的屏幕截图。

Answer 4

我会让你的生活变得非常简单。
按以下方式使用它

<img src="../image_store/Part2.jpg" alt="Dress Picture"/>

Answer 5

在React中：

1. 导入图像：

   import image from '../../assets/random-image.png'
   

2. 使用导入的变量作为src属性的值：

   <img src={image} />