HTML - <br> 태그와 &nbsp; 의 차이

 

<br> 태그

• 단일 줄 바꿈을 삽입하는 데 사용되는 줄 바꿈 태그
• 텍스트를 다음 줄로 이동하는 데 사용
• 브라우저에서 <br> 태그가 발견되면 다음 줄로 이동
  • 다음 내용이 존재하지 않으면 줄바꿈이 일어나지 않음
• 즉, 줄 바꿈에 사용

---

&nbsp; (non-breaking space)

• 구분되지 않는 공간을 나타내는 요소 참조
• 브라우저가 끊을 수 없는 두 단어 사이에 공백을 만드는 데 사용
• 즉, 줄 바꿈이 없는 공간을 만드는 데 사용

---

예시

<br> 태그와 &nbsp; 요소의 공간 확인

<table border="1">
    <tr>
        <td>
            br태그(다음내용X)
        </td>
        <td>
            br태그(다음내용O)
        </td>
        <td>
            nbsp
        </td>
    </tr>
    <tr align="center">
        <td>
            <div style="display:inline; background-color: aqua;"> 123 <br> </div>
        </td>
        <td>
            <div style="display:inline; background-color: aqua;"> 123 <br> 123</div>
        </td>
        <td>
            <div style="display:inline; background-color: aqua;"> 123 &nbsp; </div>
        </td>
    </tr>
</table>