單行文字出現省略號的條件：

<style>
 p {
     width: 200px; /*寬度*/
     text-overflow: ellipsis; /*文字以省略號的方式隱藏*/
     white-space: nowrap;/*禁止文字內容折行*/
     overflow: hidden;/*超出部分溢位隱藏*/
 }
</style>
<p>單行文字出現省略號單行文字出現省略號單行文字出現省略號</p>

多行文字出現省略號的條件：

<style>
p {
    width:200px;
    display: -webkit-box; /* 彈性盒模型*/
    -webkit-box-orient: vertical; /* 文字垂直排列 */
    -webkit-line-clamp:2; /*文字顯示的行數*/
    overflow: hidden; /*超出部分溢位隱藏*/
}
</style>
<p>多行文字出現省略號多行文字出現省略號多行文字出現省略號多行文字出現省略號</p>