单行溢出隐藏 (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 限制文本显示的行数
- -webkit-box-orient 设置其子元素的排列方式