Html 从子文件夹中选择根文件夹的图像
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3655059/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Pick images of root folder from sub-folder
提问by Moon
Let's say following is the directory structure of my website :
假设以下是我网站的目录结构：
Now in index.htmlI can simply refer images like:
现在，index.html我可以简单地引用以下图像：
<img src="./images/logo.png">
But I want to refer the same image from sub.html. What should be the src?
但我想从sub.html. 应该是什么src？
回答by Moses
../images/logo.pngwill move you back one folder.
../images/logo.png会将您移回一个文件夹。
../../images/logo.pngwill move you back two folders.
../../images/logo.png会将您移回两个文件夹。
/images/logo.pngwill take you back to the root folder no matter where you are/.
/images/logo.png无论您身在何处，都会带您回到根文件夹/。
回答by aularon
You can reference the image using relative path:
您可以使用相对路径引用图像：
<img src="../images/logo.png">
__ ______ ________
| | |
| | |___ 3. Get the file named "logo.png"
| |
| |___ 2. Go inside "images/" subdirectory
|
|
|____ 1. Go one level up
Or you can use absolute path: /means that this is an absolute path on the server, So if your server is at https://example.org/, referencing /images/logo.pngfrom any page would point to https://example.org/images/logo.png
或者您可以使用绝对路径：/表示这是服务器上的绝对路径，因此如果您的服务器位于https://example.org/，/images/logo.png则从任何页面引用都将指向https://example.org/images/标志.png
<img src="/images/logo.png">
|______ ________
| | |
| | |___ 3. Get the file named "logo.png"
| |
| |___ 2. Go inside "images/" subdirectory
|
|
|____ 1. Go to the root folder
回答by Bert F
The relative reference would be
相对参考将是
<img src="../images/logo.png">
If you know the location relative to the root of the server, that may be simplest approach for an app with a complex nested directory hierarchy - it would be the same from all folders.
如果您知道相对于服务器根目录的位置，对于具有复杂嵌套目录层次结构的应用程序来说，这可能是最简单的方法 - 所有文件夹都相同。
For example, if your directory tree depicted in your question is relative to the root of the server, then index.html and sub_folder/sub.html would both use:
例如，如果问题中描述的目录树相对于服务器的根目录，则 index.html 和 sub_folder/sub.html 都将使用：
<img src="/images/logo.png">
If the images folder is instead in the root of an application like foobelow the server root (e.g. http://www.example.com/foo), then index.html (http://www.example.com/foo/index.html) e.g and sub_folder/sub.html (http://www.example.com/foo/sub_folder/sub.html) both use:
如果图像文件夹位于foo服务器根目录下方的应用程序根目录中（例如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">
回答by Robusto
Your index.html can just do src="images/logo.png"and from sub.html you would do src="../images/logo.png"
你的 index.html 可以做src="images/logo.png"，从 sub.html 你可以做src="../images/logo.png"
回答by Bopsi
../takes you one folder up the directory tree. Then, select the appropriate folder and its contents.
../将您带到目录树中的一个文件夹。然后，选择适当的文件夹及其内容。
../images/logo.png
回答by vamsikrish
when you upload your files to the server be careful ,some tomes your images will not appear on the web page and a crashed icon will appear that means your file path is not properly arranged or coded when you have the the following file structure the code should be like this File structure: ->web(main folder) ->images(subfolder)->logo.png(image in the sub folder)the code for the above is below follow this standard
当您将文件上传到服务器时要小心，有些大部头您的图像不会出现在网页上，并且会出现崩溃的图标，这意味着当您具有以下文件结构时，您的文件路径未正确排列或编码像这样文件结构：->web(主文件夹)->images(子文件夹)->logo.png(子文件夹中的图像)上面的代码如下遵循这个标准
<img src="../images/logo.jpg" alt="image1" width="50px" height="50px">
if you uploaded your files to the web server by neglecting the file structure with out creating the folder web if you directly upload the files then your images will be broken you can't see images,then change the code as following
如果您通过忽略文件结构而不创建文件夹 web 将文件上传到 Web 服务器，如果您直接上传文件，那么您的图像将被破坏，您看不到图像，然后更改代码如下
<img src="images/logo.jpg" alt="image1" width="50px" height="50px">
thank you->vamshi krishnan
谢谢-> vamshi krishnan
回答by vamsi krishnan mysore
when you upload your files to the server be careful ,some tomes your images will not appear on the web page and a crashed icon will appear that means your file path is not properly arranged or coded when you have the the following file structure the code should be like this File structure: ->web(main folder) ->images(subfolder)->logo.png(image in the sub folder)the code for the above is below follow this standard
当您将文件上传到服务器时要小心，有些大部头您的图像不会出现在网页上，并且会出现崩溃的图标，这意味着当您具有以下文件结构时，您的文件路径未正确排列或编码像这样文件结构：->web(主文件夹)->images(子文件夹)->logo.png(子文件夹中的图像)上面的代码如下遵循这个标准
<img src="../images/logo.jpg" alt="image1" width="50px" height="50px">
<img src="../images/logo.jpg" alt="image1" width="50px" height="50px">
if you uploaded your files to the web server by neglecting the file structure with out creating the folder web if you directly upload the files then your images will be broken you can't see images,then change the code as following
如果您通过忽略文件结构而不创建文件夹 web 将文件上传到 Web 服务器，如果您直接上传文件，那么您的图像将被破坏，您看不到图像，然后更改代码如下
<img src="images/logo.jpg" alt="image1" width="50px" height="50px">
thank you->vamshi krishnan
谢谢-> vamshi krishnan
