行数を指定すると、はみ出した部分を隠して「…」を付けられます。 文字は削らないため、全文がHTMLに残ります。

.excerpt {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

複数行の省略は一部のブラウザでしか使えなかったため、JavaScriptで1文字ずつ削り、3行に収まったところで「…」を付けていました。 画面幅が変わるたびに、元の文に戻してやり直す必要もありました。

.excerpt {
  line-height: 1.5;
  max-height: 4.5em;
  overflow: hidden;
}

for (const excerpt of document.querySelectorAll('.excerpt')) {
  const text = excerpt.textContent
  const clamp = () => {
    excerpt.textContent = text
    let end = text.length
    while (excerpt.scrollHeight > excerpt.clientHeight && end > 0) {
      end--
      excerpt.textContent = text.slice(0, end) + '…'
    }
  }
  clamp()
  window.addEventListener('resize', clamp)
}