Для лучшего сравнения я добавил блочный элемент.
block
- Начинается с новой строки родительского элемента и занимает всю строку.
- Можно задавать ширину и высоту.
- Можно выровнять с помощью
vertical-align. - Margins и paddings работают со всех сторон.
inline-block
- Размер зависит от контента.
- Можно задавать ширину и высоту.
- Можно выровнять с помощью
vertical-align. - Margins и paddings работают со всех сторон.
inline
- Размер зависит от контента.
- Ширину и высоту задавать нельзя.
- Можно выровнять только по горизонтали. Место, которое занимает элемент по вертикали, зависит от line-height.
- Ведёт себя как блочный элемент, если задать вертикальные margins и paddings.