为什么本地主机上的 .html 文件和网络上上传的 .html 文件存在差异? [英] why differences there in .html file on local host and .html file uploaded on web?
问题描述
index.html
<html>
<head>
<title>image</title>
</head>
<body>
<p>
<img src="kRIsten stewart.jpg" width="200" height="200" alt="Kristen stewart" title="Kristen stewart" />
<img src="pics/Emilia clarke.jpg" height="200" width="200" alt="emilia clarke" title="emilia clarke" />
<img src="jordan-peterson.jpg" height="200" width="200" alt="jorden-peterson" title="jorden-peterson" />
<img src="pics/Kate winslet.jpg" height="200" width="200" alt="kate winslet" title="kate winslet" />
<img src="/4. Codes/HTML/hosted2/Mel robbins.jpg" height="200" width="200" alt="Mel robbins" title="Mel robbins"/>
<img src="raining gif.gif" height="200" width="200" alt="raining gif" title="raining gif" />
</p>
</body>
</html>
位置:<代码>F:/4.代码/html/hosted2/
这个 hosted2 文件夹托管在 surge.sh 上.它包含index.html文件、jorden-peterson.jpg、kristenstewart.jpg、Mel robbins.jpg, raining.gif.它还包含一个名为 pics 的文件夹，其中包含 Emilia clarke.jpg 和 kate winslet.jpg.
This hosted2 folder is hosted on surge.sh . It contains index.html file, jorden-peterson.jpg, kristen stewart.jpg, Mel robbins.jpg, raining.gif. It also contains a folder named pics, which contains Emilia clarke.jpg, and kate winslet.jpg.
当我使用文件方案 file:///F:/... 打开此 index.html 时，所有 6 张图片都显示在网络浏览器中.
When I open this index.html using file scheme file:/// F:/..., all 6 pics display in the web-browser.
但是当我通过它托管的 URL http://unsuitable-rate_bonapart.surge.sh/ 打开这个文件时，我看不到 kristenstewart.jpg 和 Mel robbins.jpg.这是为什么?
But when I open this file through URL http://unsuitable-rate_bonapart.surge.sh/ where it is hosted, I am unable to see kristen stewart.jpg and Mel robbins.jpg. Why is that ?
1.克里斯汀斯图尔特.jpg.
1.kristen stewart.jpg.
我在 index.html 文件 KRIstenstewart.jpg 中给出路径时将 2 个字母设为大写.但在位置文件是克里斯汀斯图尔特.jpg
I make 2 letters uppercase while giving path in index.html file KRIsten stewart.jpg. But in location the file is kristen stewart.jpg
5.梅尔罗宾斯.jpg
5.Mel robbins.jpg
/4.Codes/HTML/hosted2/Mel robbins.jpg 我给出了绝对路径.
/4. Codes/HTML/hosted2/Mel robbins.jpg I gave absolute path.
所以我在上传时在浏览器上的感觉是我上传了 hosted2 文件夹，所以它不知道上层文件夹(hosted2)所以它不能显示 Mel robbins.jpg 和 kristenstewart.jpg.我觉得这是因为surge.sh 可能有文件名应该区分大小写的策略.
So what I feel that on browser while uploading I uploaded hosted2 folder so it doesn't know upper folders to that(hosted2) so It can't show Mel robbins.jpg and kristen stewart.jpg. I feel it's due to surge.sh might have policy that the file name should be case sensitive.
所以我有这种感觉.我不知道确切.请解释为什么会发生这种情况.
So I feel this. I don't know exactly. Please explain why this is happening.
推荐答案
首先不要在 img src 中使用空格(用-"或_"代替).
First of all don't use spaces in your img src (replace them by "-" or "_").
如果您的 kristenstewart 的文件名是 kristen-stewart.jpg，则将其命名为 kristen-stewart.jpg 而不是 kRIsten-stewart.jpg.
If your kristen stewart's file name is kristen-stewart.jpg then call it by kristen-stewart.jpg not kRIsten-stewart.jpg.
然后/4.Codes/HTML/hosted2/Mel robbins.jpg 不是绝对路径.绝对路径将是(例如)https://yourdomainname.com/yourimage.jpg.所以也许可以考虑相对路径或有效的绝对路径.
Then /4. Codes/HTML/hosted2/Mel robbins.jpg is not an absolute path. An absolute path will be (for example) https://yourdomainname.com/yourimage.jpg. So maybe consider relative path or a valide absolute path.
注意:添加./"；在 src 的开头使用相同的文件夹和../"；移动到上层文件夹.
Note: Add "./" at the beginning of your src to use the same folder and "../" to move to the upper folder.
这篇关于为什么本地主机上的 .html 文件和网络上上传的 .html 文件存在差异?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
