溢出：最后隐藏点

Question

假设我有一个字符串“ 我喜欢大屁股，我不能说谎”，我用 overflow:hidden 剪切它，所以它显示如下：

我喜欢大屁股而且我不能

切断文本。是否可以这样显示：

我喜欢大屁股，我不能…

使用 CSS？

原文由 mannicken 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您可以使用 文本溢出：省略号； 根据 caniuse 的说法，所有主要浏览器都支持它。

这是jsbin上 的演示。

 .cut-text {
  text-overflow: ellipsis;
  overflow: hidden;
  width: 160px;
  height: 1.2em;
  white-space: nowrap;
}

 <div class="cut-text">
I like big butts and I can not lie.
</div>

原文由 Joe Phillips 发布，翻译遵循 CC BY-SA 4.0 许可协议