HTML 태그 구분

박스와 아이템

box : 브라우저(출력)에 보이지 않음

ex) header section footer div span form ...

item : 특별한 속성을 가지고 브라우저(출력)에 보임

ex) a button input img label video ...

block과 inline 그리고 inline-block

block: 요소가 줄바꿈 되어 배열됨

ex) h1 div p ul li ...

• width, height, margin, padding 정해주면 반영

inline: 요소가 줄바꿈 되지 않고 최소 너비가짐

ex) a span ...

• width, height 반영 안됨 margin, padding 좌우만 반영

inline-block: 배치는 inline과 같지만 block처럼 속성 반영됨

ex) button input ...

• width, height, margin, padding 반영
  
  

*inline은 글자를 만들기 위한 요소이고 block은 레이아웃을 만들기 위한 요소이다.

더 많은 내용은 mdn에서 참고하면 된다.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element#text_content
MDN