CSS3 文字超过部分使用省略号替代

1.一行中超出固定长度的部分以省略号显示

    width: 100px;   
    overflow: hidden;        /*内容会被修剪，并且其余内容是不可见的*/
    text-overflow:ellipsis;  /*显示省略符号来代表被修剪的文本。*/
    white-space: nowrap;     /*文本不换行*/

CSS3 文字超过部分使用省略号替代

-webkit-line-clamp: 1; /* 显示的行数 */
display: -webkit-box;/*必须结合的属性,将对象作为弹性伸缩盒子模型显示*/
-webkit-box-orient: vertical;   /*必须结合的属性,设置或检索伸缩盒对象的子元素的排列方式*/
overflow: hidden;   /*文本会被修剪，并且剩余的部分不可见*/
text-overflow: ellipsis;   /*显示省略号来代表被修剪的文本*/

当遇到英文失效时，添加如下属性，兼容英文和数字

word-break: break-all;