如何设置div标签中的文本溢出时-只显示三个点呢?


摘要:
下文讲述使用css为div元素中文字溢出部分设置为显示三个点的方法分享,如下所示;

div中文本溢出,是我们常见的现象,那么如何在文本溢出的部分隐藏,并显示三个点呢?
下文将一一道来,如下所示:

实现思路:
    使用text-overflow:ellipsis即可为div溢出的文本设置三个点的缩略符 

/*单行溢出的设置方法*/
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
width: 90%; 

/*多行溢出,只显示三点的设置方法*/
overflow: hidden;  
text-overflow: ellipsis;  
display: -webkit-box;  
-webkit-line-clamp: 3;  
-webkit-box-orient: vertical;