.cut-text {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

<style>
    .dots
    {
        display: inline-block;
        width: 325px;
        white-space: nowrap;
        overflow: hidden !important;
        text-overflow: ellipsis;
    }

    .dot
    {
        display: inline-block;
        width: 185px;
        white-space: nowrap;
        overflow: hidden !important;
        text-overflow: ellipsis;
    }
</style>

希望这对你有帮助:

.text-with-dots { 显示:块; max-width: 98%; 空白:nowrap;} 溢出:隐藏!重要; 文本溢出:省略; ｝ <div class='text-with-dots'>这里有一些文本这里有一些文本这里有一些文本这里有一些文本这里有一些文本这里有一些文本</div>

.cut-text {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

是的，通过css3中的text-overflow属性。注意:它还没有被浏览器普遍支持。

你可以使用text-overflow: ellipsis;根据caniuse的说法，所有主流浏览器都支持这个功能。

这是jsbin上的一个演示。

.cut-text { 文本溢出:省略; 溢出:隐藏; 宽度:160 px; 高度:1.2 em; 空白:nowrap;} ｝ < div class = "剪切文本”> 我喜欢大屁股，我不会撒谎。 < / div >