在做前端项目时,时常会遇到单行文本过长,而将样式撑开,或者自动换行;当需要不自动换行或不让其将样式撑开的时候,就需要用到将多余字符隐藏起来,或者显示省略号:
/**css样式实例 单行超出部分显示省略号**/
p{
white-space:nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
/**css样式实例 自定义多行超出部分显示省略号**/
div{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3; /* 控制最多显示几行 */
-webkit-box-orient: vertical;
}