css处理文字超出省略号代替

文字用省略号代替

• 单行文字省略号处理.

/*超过范围进行隐藏不显示*/
overflow: hidden; 
/*文本溢出, 使用省略号 */
text-overflow:ellipsis;
/*连续的空白符会被合并,但文本内的换行无效*/ 
white-space: nowrap;

• 多行文字省略号处理.

/*超过范围进行隐藏不显示*/
overflow : hidden;
/*文本溢出, 使用省略号 */
text-overflow: ellipsis;
/* 以webkit盒子展示, 比较适用于webkit内核和移动端*/
display: -webkit-box;
/*限制块容器显示的文本行数, 按照你的需求设置*/
-webkit-line-clamp: 2;
/*盒子的方向, 垂直、水平等*/
-webkit-box-orient: vertical;
/*文字换行, 可以在单词内断*/
word-wrap: break-word;