[Html] div 와 span의 차이점에 대해 알아보자.

※ <div></div>

• Division의 약자
• 웹사이트의 레이아웃(틀) 구성시 사용
  • 각각의 블록을 적절하게 배치하고 CSS를 사용해 스타일 적용​

※ <span></span>

• span - 범위라는 의미
• span태그 내부에 객체가 들어가면 그 객체 크기만큼 공간 할

※ <div></div> VS <span></span>

● div(block 요소) / span(inline 요소)

<div class="bdr-red">
   <a href="#">div</a>
   <a href="#">div</a>
   <a href="#">div</a>    
</div>
  
<br>
<br>
<br>
  
<span class="bdr-red">
  <a href="#">span</a>
  <a href="#">span</a>
  <a href="#">span</a>
</span>

 

● margin 적용시

    - div: 모든 방향 (상하좌우)에 적용

    - span: 양옆 (좌우)에만 적용

 

 

참고 사이트

https://blog.naver.com/PostView.nhn?blogId=shin_soosoo&logNo=221443660474&parentCategoryNo=&categoryNo=12&viewDate=&isShowPopularPosts=false&from=postView