기타
마크다운 이미지 나란히, 이미지 정렬 하는법
ysk(0soo)
2023. 4. 26. 23:52
이미지 나란히
1. 마크다운 테이블 그리는법 활용
이미지링크 | 이미지링크
---|---|
2. html 태그 사용
<p align="center">
<img src="이미지경로" align="center" width="32%">
<img src="이미지경로" align="center" width="32%">
<img src="이미지경로" align="center" width="32%">
<figcaption align="center">3개 이미지 띄우기</figcaption>
</p>
3. figure 태그 사용
2개인경우
<figure class="half">
사용
<figure class="half">
<a href="link"><img src="이미지경로"></a>
<a href="link"><img src="이미지경로"></a>
<figcaption>2개이미지.</figcaption>
</figure>
3개 인경우
<figure class="thrid">
사용
<figure class="thrid">
<a href="link"><img src="이미지경로"></a>
<a href="link"><img src="이미지경로"></a>
<figcaption>3개이미지</figcaption>
</figure>
이미지 정렬
- 이미지 좌측 정렬
<img src='./images/box-cox-translation.png' align='left'/>
- 이미지 중앙 정렬
<img src='./images/box-cox-translation.png' align='center'/>
<center><img src="/img/myImg.png" width="300" height="300"></center>
- 이미지 우측 정렬
<img src='./images/box-cox-translation.png' align='right'/>
이미지에 주석달기
<figcaption> 주석 내용 </figcaption>