{ display : block }

block 요소는 화면 가로 영역 전체를 차지한다.
block 속성이 디폴트 값인 태그로 <header> <footer> <p> <li> <table> <div> <h1> 등이 있다.

---

{ display : inline }

inline 요소는 inline 요소끼리 한 줄에 위치할 수 있다.
inline 속성이 디폴트인 태그로 <span> <a> <img> 등이 있다.
inline 은 width, height 를 적용할 수 없다.

---

{ display : inline-block }

inline-block은 inline처럼 같은 라인에 여러 태그를 위치시킬 수 있다.
그리고 inline에서 사용하지 못하는 width/height 를 적용할 수 있다.

결론

inline-block은 css로 display: inline-block 속성을 따로 줘야 해서 번거롭다. 따라서 디테일한 보정이 필요한 경우에만 👉inline-block을 사용하고, 간단한 작업만 하는 경우(ex. 텍스트 스타일링) 👉inline을 쓰면 된다. (여기서 inline을 쓴다는 것은 <span>같은 inline 태그를 그대로 사용한다는 뜻)