單行溢出隱藏 (IE6俊嗽、IE7必須設置寬度)
div{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
多行溢出隱藏
div{
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
}
webpack打包后不顯示-webkit-box-orient的問題
div{
/*! autoprefixer: off */
-webkit-box-orient: vertical;
/* autoprefixer: on */
}
注:
- display: -webkit-box 將元素作為彈性伸縮盒子模型顯示
- -webkit-line-clamp 限制文本顯示的行數(shù)
- -webkit-box-orient 設置其子元素的排列方式