하위 폴더에서 루트 폴더의 이미지 선택
내 웹 사이트의 디렉토리 구조는 다음과 같습니다.
이제 index.html
다음과 같은 이미지를 간단히 참조 할 수 있습니다.
<img src="./images/logo.png">
하지만에서 동일한 이미지를 참조하고 싶습니다 sub.html
. 무엇이어야 src
합니까?
상대 경로를 사용하여 이미지를 참조 할 수 있습니다.
<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
../images/logo.png
한 폴더 뒤로 이동합니다.
../../images/logo.png
두 폴더 뒤로 이동합니다.
/images/logo.png
어디에 있든 루트 폴더로 돌아갑니다.
상대 참조는
<img src="../images/logo.png">
서버의 루트와 관련된 위치를 알고 있다면 복잡한 중첩 디렉터리 계층 구조를 가진 앱에 대한 가장 간단한 접근 방식 일 수 있습니다. 모든 폴더에서 동일합니다.
예를 들어 질문에 표시된 디렉토리 트리가 서버의 루트에 상대적인 경우 index.html 및 sub_folder / sub.html은 모두 다음을 사용합니다.
<img src="/images/logo.png">
대신 이미지 폴더가 foo
서버 루트 (예 :) 아래와 같은 애플리케이션의 루트에있는 http://www.example.com/foo
경우 index.html ( http://www.example.com/foo/index.html
) 예 및 sub_folder / sub.html ( http://www.example.com/foo/sub_folder/sub.html
)은 모두 다음을 사용합니다.
<img src="/foo/images/logo.png">
index.html은 그냥 할 수 src="images/logo.png"
있고 sub.html에서 할 수 있습니다.src="../images/logo.png"
../
디렉토리 트리에서 한 폴더 위로 이동합니다. 그런 다음 적절한 폴더와 그 내용을 선택합니다.
../images/logo.png
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
<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
<img src="images/logo.jpg" alt="image1" width="50px" height="50px">
thank you->vamshi krishnan
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
<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
<img src="images/logo.jpg" alt="image1" width="50px" height="50px">
thank you->vamshi krishnan
참고URL : https://stackoverflow.com/questions/3655059/pick-images-of-root-folder-from-sub-folder
'IT TIP' 카테고리의 다른 글
뷰 컨트롤러간에 페이드 / 전환 없음을 어떻게 수행합니까? (0) | 2020.12.09 |
---|---|
Intellij 14 이상한 편집기 / 커서 동작 (0) | 2020.12.09 |
교차하는 디스크 수를 계산하는 알고리즘 (0) | 2020.12.09 |
cmd.exe (배치) 스크립트의 배열, 연결 목록 및 기타 데이터 구조 (0) | 2020.12.09 |
ArrayList에서 요소의 모든 발생 제거 (0) | 2020.12.09 |