如何使用CSS将长文本指示为较小的固定列?

前端之家收集整理的这篇文章主要介绍了如何使用CSS将长文本指示为较小的固定列?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如何将长文本适合于固定宽度的列,其中我只有一行文本的空间?文本需要被切割为固定的宽度(让我们说到100px),我想在末尾添加点“…”。这样的例子:

给定字符串:

Some really long string that I need to fit in there!

固定宽度列中的所需输出应为:

Some really long string...

解决方法

你可以单独使用CSS:
.Box {
    -o-text-overflow: ellipsis;   /* Opera */
    text-overflow:    ellipsis;   /* IE,Safari (WebKit) */
    overflow:hidden;              /* don't show excess chars */
    white-space:nowrap;           /* force single line */
    width: 300px;                 /* fixed width */
}

注意:您需要检查最新的浏览器支持

猜你在找的CSS相关文章