1.在表格中的td,实现文字溢出省略
table{width:100%;table-layout:fixed;/* 只有定义了表格的布局算法为fixed，下面td的定义才能起作用。 */}
td{
width:100%;//自己调整
word-break:keep-all;/* 不换行 */
white-space:nowrap;/* 不换行 */
overflow:hidden;
text-overflow:ellipsis;
}
2.单行超出隐藏
div{
overflow:hidden; //超出的文本隐藏
text-overflow:ellipsis; //用省略号显示
white-space:nowrap; //不换行
}
3.多行超出省略
- display:-webkit-box; //将对象作为弹性伸缩盒子模型显示。
div{
overflow:hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
4.脚本控制
window.onload = function(){
var text = document.getElementsByClassName('ellipsis');
for(var i=0;i<text.length;i++){
str = text[i].innerHTML;
textLeng = 8;
if(str.length > textLeng ){
text[i] .innerHTML = str.substring(0,textLeng )+"...";
}
}
}
