inline

inline 속성은 해당 엘리먼트의 위, 아래 값을 계산하지 않습니다. 또한 inline 속성 엘리먼트끼리는 서로 같은 줄에 위치하게 만듭니다.

inline-block

inline-block 속성은 같은 속성을 가진 엘리먼트끼리 서로 같은 줄에 위치하게 만든다는 것은 inline 속성과 같지만 위, 아래 값을 계산합니다.

block

block 속성은 위, 아래, 오른쪽, 왼쪽 값을 모두 계산합니다. 또한 block 속성을 가진 엘리먼트 다음에 오는 엘리먼트는 다음 줄에 위치하게 만듭니다.

참고

1. [CSS] display 속성: inline, block, inline-block
https://www.daleseo.com/css-display-inline-block/