마크 다운에 로컬 이미지를 표시하는 방법

나는 마크 다운에서 다음을 시도했지만 작동하지 않는 것 같습니다. 누구든지 마크 다운에서 로컬 이미지를 표시하는 방법을 알고 있습니까? 나는 그것을 위해 웹 서버를 설정하고 싶지 않습니다. 감사

![image](files/Users/jzhang/Desktop/Isolated.png)

경로가 올바르지 않은 것 같습니다. user7412219가 언급했듯이 우분투와 창은 경로를 다르게 처리합니다. 노트북과 동일한 폴더에 이미지를 넣고 다음을 사용하십시오.

![alt text](Isolated.png "Title")

Windows에서 바탕 화면은 C : \ Users \ jzhang \ Desktop에 있어야합니다.

다음은 문서 옆의 하위 폴더에 대한 이미지의 상대 경로와 함께 작동합니다 (현재 Windows 시스템에서만 테스트 됨).

![image info](./pictures/image.png)

가장 좋은 해결책은 md 문서가있는 폴더에 상대적인 경로를 제공하는 것입니다.

브라우저가 로컬 파일의 절대 경로를 확인하려고 할 때 문제가있을 수 있습니다. 웹 서버를 통해 파일에 액세스하면 해결할 수 있지만, 그런 상황에서도 이미지 경로가 정확해야합니다.

모든 이미지를 포함하는 문서의 동일한 수준에 폴더를 갖는 것이 가장 깨끗하고 안전한 솔루션입니다. GitHub, 로컬, 로컬 웹 서버에로드됩니다.

images_folder/img.jpg  < works


/images_folder/img.jpg  < this will work on webserver's only (please read the note!)

절대 경로를 사용하면 다음과 같은 URL로만 이미지에 액세스 할 수 있습니다. http : //hostname.doesntmatter/image_folder/img.jpg

단계별 :

1. 이미지 와 같은 이름의 디렉토리 를 만들고 Markdown에 의해 렌더링 될 모든 이미지 를 넣으십시오.

2. 예를 들어, example.png 를 Images에 넣으십시오 .

3. 이전에 이미지 디렉토리 에 있던 example.png 를로드하려면 .

![title](Images/example1.png)

참고 : 이미지 디렉토리는.md확장자가있는 마크 다운 텍스트 파일과 동일한 디렉토리에 있어야합니다.

마크 다운 파일에 이미지를 추가하려면 .md 파일과 이미지가 동일한 디렉토리에 있어야합니다. 내 경우와 마찬가지로 .md 파일이 doc 폴더에 있었으므로 이미지도 같은 폴더로 옮겼습니다. 그 후 .md 파일에 다음 구문을 작성하십시오.

![alt text](filename)

처럼 ![Car Image](car.png)

이것은 나를 위해 일했습니다.

로컬 이미지를 추가하면 다음과 같이 작동했습니다. ![alt text](file://IMG_20181123_115829.jpg)

없이 file:// 접두사가 (MarkdownViewer ++ 부가 기능과 Win10, 메모장 ++) 작동하지 않았다

편집 : html 태그에서도 작동한다는 것을 알았습니다. <img src="file://IMG_20181123_115829.jpg" alt="alt text" width="200"/>

Edit2 : Atom 편집기에서는 접두사 없이 만 작동 file://합니다. 엉망이야.

내가 아는 한 Linux의 VSCode의 경우 로컬 이미지는 일반적으로 이미지를 .md게시물 파일 과 동일한 폴더에 넣을 때만 표시 될 수 있습니다 .
즉, ![](image.jpg)또는 ![](./image.jpg)작동합니다.
같은 절대 경로 ![](/home/bala/image.jpg)도 작동하지 않습니다.

편집 :

나를 위해 일하기 (로컬 이미지 용)

![system schema](doc/systemDiagram.jpg)

 tree
 ├── doc
     └── jobsSystemSchema.jpg
 ├── README.md

markdown 파일 README.md는 doc 디렉토리와 동일한 수준에 있습니다.

귀하의 경우 마크 다운 파일은 디렉토리 파일과 동일한 수준에 있어야합니다.

나를 위해 일하기 (원시 경로가있는 절대 URL)

![system schema](https://server/group/jobs/raw/master/doc/systemDiagram.jpg)

나를 위해 작동하지 않음 (blob 경로가있는 URL)

![system schema](https://server/group/jobs/blob/master/doc/systemDiagram.jpg)

표시되지 않는 로컬 이미지의 또 다른 가능성 은 이미지 참조의 의도하지 않은 들여 쓰기 입니다.![alt text](file) .

이것은 '이미지 포함'대신 '코드 블록'을 만듭니다. 선행 공백을 제거하십시오.

R Markdown에 이미지를 삽입하는 데 문제가 있습니다. 전체 URL을 수행하면 C:/Users/Me/Desktop/Project/images/image.png작동하는 경향이 있습니다. 그렇지 않으면 마크 다운을 이미지와 같은 디렉토리 나 조상 디렉토리에 넣어야합니다. 이미지를 참조 할 때 선언 된 뜨개질 디렉토리가 무시되는 것으로 보입니다.

마크 다운 파일과 동일한 폴더에 이미지를 넣거나 이미지에 대한 상대 경로를 사용하십시오.

이미지를 복사 한 다음 붙여 넣으면 출력이 표시됩니다.

![image.png](attachment:image.png)

에서 Jupyter 노트북 마크 다운 , 당신은 사용할 수 있습니다

<img src="RelPathofFolder/File" style="width:800px;height:300px;">

도구에 따라 HTML을 마크 다운에 삽입 할 수도 있습니다.

<img src="./img/Isolated.png">

이것은 폴더 구조가 다음과 같다고 가정합니다.

 ├── img
     └── Isolated.jpg
 ├── README.md

웹 서버를 설정할 필요가 없습니다.

요점의 댓글 섹션에 내 로컬 이미지를 업로드하고 생성 된 URL을 복사하여 붙여 넣었습니다. 나를 위해 일했습니다 😊

해결책이 있습니다.

a) 인터넷 예 :

![image info e.g. Alt](URL Internet to Images.jpg "Image Description")

b) 로컬 이미지 예 :

![image Info](file:///<Path to your File><image>.jpg "Image Description")
![image Info](file:///C:/Users/<name>/Pictures/<image>.jpg "Image Description")

TurboByte