/* 單行溢出隱藏 */
div{
width: 150px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/* 多行溢出隱藏 */
div{
width: 150px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
}
注:
1追城、-webkit-line-clamp用來限制在一個塊元素顯示的文本的行數(shù)贯城。 為了實現(xiàn)該效果,它需要組合其他的WebKit屬性。常見結(jié)合屬性:
2衣形、display: -webkit-box; 必須結(jié)合的屬性 ,將對象作為彈性伸縮盒子模型顯示 姿鸿。
3谆吴、-webkit-box-orient 必須結(jié)合的屬性 ,設(shè)置或檢索伸縮盒對象的子元素的排列方式 苛预。