html5多行文本溢出,用 css 或 js 实现多行文本溢出省略效果

用 css 或 js 实现多行文本溢出省略效果

CSS版：

如何用 css 或 js 实现多行文本溢出省略效果，考虑兼容性

.test{

width: 100px;

height: 46px;

overflow: hidden;

display: -webkit-box;

-webkit-box-orient: vertical;

-webkit-line-clamp:2

}

js版：

如何用 css 或 js 实现多行文本溢出省略效果，考虑兼容性

.test{

width: 100px;

overflow: hidden;

position: relative;

line-height: 20px;

max-height: 40px;

}

const p = document.querySelector('#test')

let words = p.innerHTML.split(/(?<=[\u4e00-\u9fa5])|(?<=\w*?\b)/g)

while (p.scrollHeight > p.clientHeight) {

words.pop()

p.innerHTML = words.join('') + '...'

}