处理文字的换行,超出省略等white-space属性

normal:默认处理方式。
pre:用等宽字体显示预先格式化的文本,不合并文字间的空白距离,当文字超出边界时不换行。可查阅pre对象
nowrap:强制在同一行内显示所有文本,合并文本间的多余空白,直到文本结束或者遭遇br对象。
pre-wrap:用等宽字体显示预先格式化的文本,不合并文字间的空白距离,当文字碰到边界时发生换行。
pre-line:保持文本的换行,不保留文字间的空白距离,当文字碰到边界时发生换行。 

  

 

.c_text_ellipsis_2 {
    //注意不能用padding,只能用margin顶开
    //2行的时候超出隐藏,有兼容
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.c_text_ellipsis_1 {
    //注意如果用了flex,记得在display:flex级别写overflow: hidden;
    //一行的时候超出隐藏
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

  

 

posted @ 2020-04-06 17:19  瞳孔中的那一抹黑  阅读(302)  评论(0)    收藏  举报