CSS で指定幅を超えた文字列を切り取り「…」を付加する方法

p.overflow {
  width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

white-space:nowrap で、改行を半角スペースとして表示させる。これにより、文字列を 1 行におさめる。
overflow:hidden とする事で、はみ出し部分を切り取っている（＝表示しないようにしている）。
text-overflow:ellipsis とする事で、はみ出した際に末尾に「…」が付加される。

CSS で指定幅を超えた文字列を切り取り「…」を付加する方法