- 文字超出省略號總結
//一行省略號
.box{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
// >1 行的省略號
// line-clamp 可以把 塊容器 中的內容限制爲指定的行數.
.box{
display:-webkit-box; // 作爲彈性伸縮盒子模型顯示
-webkit-box-orient:vertical; // 設置伸縮盒子的子元素排列方式--從上到下垂直排列
-webkit-line-clamp: 2; // 顯示的行 ,
overflow: hidden;
}
效果