Отличие свойства text-decoration от псевдоэлементов ::before и ::after для создания подчёркивания заключается в их функциях и возможностях.

Свойство text-decoration позволяет указать положение декоративной линии. 1 Возможные значения: underline (подчёркнутый текст), line-through (перечёркнутый текст), overline (надчёркнутый текст, линия находится над словами), none (отменяет все эффекты). 15 При использовании text-decoration нельзя управлять толщиной и точным положением линии. 1

Псевдоэлементы ::before и ::after используют, когда нужно задать тексту или ссылке подчёркивание, отличающееся от стандартного по толщине или положению, а также когда необходимо анимировать появление или пропадание линии. 1 Псевдоэлементы расширяют возможности по дизайну, поскольку к ним можно применять разнообразное стилевое оформление, и они управляются независимо от самого элемента, оставаясь к нему привязанными. 2

Таким образом, text-decoration подходит для стандартного подчёркивания, а псевдоэлементы ::before и ::after — для более сложных задач, связанных с дизайном подчёркивания.