1. 程式人生 > >文字超出加省略隱藏的兩種方法

文字超出加省略隱藏的兩種方法

第一種方法:

.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>