HTML/CSS:指定<span>中的行数

Question

我有一个PHP-Webapp和span,看起来像这样:

<span><?= $text ?></span>

我想确保,跨度只有一行.因此,如果文字太长,我想不显示最后的话.我可以使用HTML/CSS吗？或者我是否必须使用PHP/Javascript缩短文本？

Answer 1

这个怎么样？(显然你会将宽度设置为页面上需要的宽度)

文本溢出:省略号是CSS3,仅在现代浏览器中支持,因此在较旧的浏览器中,您将在结尾处获得令人讨厌的中间字母/单词.

span{display: block; width: 100px; overflow: hidden; word-wrap: break-word; text-overflow: ellipsis;}

Answer 2

我向你推荐下面的代码

span {
        display: -webkit-box;
        -webkit-line-clamp: 2;  // <- you can change rows number
        -webkit-box-orient: vertical;
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
}