GitHub README.md에서 이미지를 나란히 표시하려면 어떻게해야합니까?

GitHub README.md에서 이미지를 나란히 표시하려면 어떻게해야합니까?

---

내 README.md에서 두 사진을 비교하려고하는데 나란히 표시하고 싶습니다. 다음 은 두 이미지가 현재 배치 된 방법입니다. 위와 아래가 아닌 두 개의 태양열 색 구성표를 나란히 표시하고 싶습니다. 도움을 주시면 감사하겠습니다.

---

이 문제를 해결하는 가장 쉬운 방법 은 GitHub의 풍미 마크 다운에 포함 된 테이블을 사용하는 것입니다 .

구체적인 예를 들면 다음과 같습니다.

Solarized dark             |  Solarized Ocean
:-------------------------:|:-------------------------:
![](https://...Dark.png)  |  ![](https://...Ocean.png)

머리글로 Solarized Dark 및 Ocean이 포함 된 테이블을 만든 다음 첫 번째 행의 이미지를 포함합니다. 분명히 당신은 ...실제 링크로 바꿀 것 입니다. :들 (그들은 단지이 경우에는 좀 필요가 세포에있는 내용을 중심으로) 선택 사항입니다. 또한 이미지를 더 작게 나란히 표시하도록 크기를 줄이려고 할 수 있습니다.

---

각 이미지의 마크 다운을 같은 줄에 작성하여 각 이미지를 나란히 배치 할 수 있습니다.

![alt-text-1](image1.png "title-1") ![alt-text-2](image2.png "title-2")

이미지가 너무 크지 않으면 GitHub의 README 파일 스크린 샷에서 보여지는 것처럼 인라인으로 표시됩니다.

---

이미지가 넓지 않으면 3 개의 이미지가 나란히 표시됩니다.

<p float="left">
  <img src="/img1.png" width="100" />
  <img src="/img2.png" width="100" /> 
  <img src="/img3.png" width="100" />
</p>

---

다른 예제와 비슷하지만 html 크기를 사용하면 다음을 사용합니다.

<img src="image1.png" width="425"/> <img src="image2.png" width="425"/> 

여기에 예가 있습니다

<img src="https://openclipart.org/image/2400px/svg_to_png/28580/kablam-Number-Animals-1.png" width="200"/> <img src="https://openclipart.org/download/71101/two.svg" width="300"/>

나는 이것을 Remarkable 사용하여 테스트했습니다 .

---

나처럼 @wiggin answer가 작동하지 않고 이미지가 여전히 인라인으로 나타나지 않으면 html 이미지 태그의 'align'속성과 일부 중단을 사용하여 원하는 효과를 얻을 수 있습니다.

# Title

<img align="left" src="./documentation/images/A.jpg" alt="Made with Angular" title="Angular" hspace="20"/>
<img align="left" src="./documentation/images/B.png" alt="Made with Bootstrap" title="Bootstrap" hspace="20"/>
<img align="left" src="./documentation/images/C.png" alt="Developed using Browsersync" title="Browsersync" hspace="20"/>
<br/><br/><br/><br/><br/>

## Table of Contents...

분명히, 당신은 이미지의 크기에 따라 더 많은 휴식을 사용해야합니다.

참고 URL : https://stackoverflow.com/questions/24319505/how-can-one-display-images-side-by-side-in-a-github-readme-md