Свойство text-overflow

Свойство text-overflow задает способ обрезки текста, не поместившегося в середине элемента.

Вы можете указать, что для обозначения любого скрытого текста используется ellipsis"..."или какой-то другой символ.

Если у блока есть свойство overflow со значением hidden, любой текст, который является слишком большим, чтобы уместиться в блоке, будет отрезан. То же самое касается auto или scroll, хотя в таких случаях пользователь имеет возможность прокрутки. В любом случае, в зависимости от того, где текст был прерван пользователь может или не может быть видеть его (ту частицу, которая не уместилась). Вы можете использовать text-overflow, чтобы предоставить визуальную подсказку пользователю о том, что есть больше контента, например, символ "...".

Свойство text-overflow влияет только на содержимое. В этом случае его можно использовать с overflow-x, но не с overflow-y.

Во многих случаях текст просто перенесется на следующую строку. Свойство text-overflow влияет только на контент, который не может быть обрезан (например, из-за слишком длинного слова или когда свойство white-space установлено на nowrap).

Примечание: это свойство работает только тогда, когда для блока установлено свойство overflow как auto или hidden.