文本超出加省略隐藏的两种方法

第一种方法：

.text{

overflow: hidden;

text-overflow: ellipsis;  //隐藏加省略号

display: -webkit-box;

-webkit-box-orient: vertical;

-webkit-line-clamp:1;    //指定第一行开始省略隐藏

}

 

第二种方法：

<div id="demo"></div>

css样式

#demo{width:100px;}

js

<script>

var oBox = document.getElementById("demo");

var demoHtml = oBox.innerHTML.slice(0,100)+"...";

oBox.innerHTML = demoHtml;

</script>