*개행되지 않고 옆으로 나열되는 경우

1. <img> 태그로만 이미지를 넣는 경우

<img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16040423603.jpg" style="width:100px; height:100px;">
<img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16063864967.jpg" style="width:100px; height:100px;">
<img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i13720578439.jpg" style="width:100px; height:100px;">


 




2. <span> 태그 사이에 이미지를 넣는 경우

<span><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16040423603.jpg" style="width:100px; height:100px;"></span>
<span><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16063864967.jpg" style="width:100px; height:100px;"></span>
<span><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i13720578439.jpg" style="width:100px; height:100px;"></span>


 




3. <div> 태그 혹은 <span> 태그의 style 내부 속성으로 display:inline-block 으로 설정하는 경우

<div style="display:inline-block;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16040423603.jpg" style="width:100px; height:100px;"></div>
<div style="display:inline-block;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16063864967.jpg" style="width:100px; height:100px;"></div>
<div style="display:inline-block;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i13720578439.jpg" style="width:100px; height:100px;"></div>


 



<span style="display:inline-block;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16040423603.jpg" style="width:100px; height:100px;"></span>
<span style="display:inline-block;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16063864967.jpg" style="width:100px; height:100px;"></span>
<span style="display:inline-block;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i13720578439.jpg" style="width:100px; height:100px;"></span>


 





4. <div> 태그 혹은 <span> 태그의 style 내부 속성으로 display:table-cell 로 설정하는 경우

<div style="display:table-cell;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16040423603.jpg" style="width:100px; height:100px;"></div>
<div style="display:table-cell;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16063864967.jpg" style="width:100px; height:100px;"></div>
<div style="display:table-cell;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i13720578439.jpg" style="width:100px; height:100px;"></div>


 


<span style="display:table-cell;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16040423603.jpg" style="width:100px; height:100px;"></span>
<span style="display:table-cell;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16063864967.jpg" style="width:100px; height:100px;"></span>
<span style="display:table-cell;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i13720578439.jpg" style="width:100px; height:100px;"></span>


 







*~ -------------------------------------------------- ~*

*개행되어 밑으로 넘어가는 경우


1. <br> 태그가 껴있는 경우

<img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16040423603.jpg" style="width:100px; height:100px;"><br>
<img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16063864967.jpg" style="width:100px; height:100px;"><br>
<img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i13720578439.jpg" style="width:100px; height:100px;"><br>





 



2. <div> 태그 사이에 이미지를 넣는 경우

<div><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16040423603.jpg" style="width:100px; height:100px;"></div>
<div><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16063864967.jpg" style="width:100px; height:100px;"></div>
<div><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i13720578439.jpg" style="width:100px; height:100px;"></div>


 



3. <div> 태그 혹은 <span> 태그의 style 내부 속성으로 display:block 으로 설정하는 경우

<div style="display:block;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16040423603.jpg" style="width:100px; height:100px;"></div>
<div style="display:block;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16063864967.jpg" style="width:100px; height:100px;"></div>
<div style="display:block;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i13720578439.jpg" style="width:100px; height:100px;"></div>


 


<span style="display:block;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16040423603.jpg" style="width:100px; height:100px;"></span>
<span style="display:block;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i16063864967.jpg" style="width:100px; height:100px;"></span>
<span style="display:block;"><img src="https://upload2.inven.co.kr/upload/2017/11/26/bbs/i13720578439.jpg" style="width:100px; height:100px;"></span>


 






*~ -------------------------------------------------- ~*

*개행되지 않는 경우, 개행되는 경우는 대표적으로 이런 경우들이 있습니다.

규칙은 이렇습니다.


1. 상위태그로 감싸지 않고 <img> 태그만 사용할 경우, 강제로 개행되지 않는다.

2. <span>태그로 감싸기만 할 경우,
   inline-block일 경우, table-cell일 경우
  강제로 개행되지 않는다.

3. <br> 태그는 한 줄을 개행시킨다.

4. <div> 태그로 감싸기만 할 경우, 강제로 개행된다.

5. block일 경우, 강제로 개행된다.



그 외에도 많은 규칙들이 있지만, 대표적인 경우들입니다.

인장 html 소스 코드를 확인해보시고, 이에 해당되지 않거나

추가적인 질문이 있으시다면 글이나 댓글로 남겨주시기 바랍니다:)