CSS-文字超出自动显示省略号

只针对单行文本有效；

01.针对块状元素

ul li{
    width: 180px;
    text-overflow: ellipsis;
    white-space: nowrap;/*禁止自动换行*/
    overflow: hidden;
}

02.针对table

table{
    table-layout:fixed;
}
table td{
    word-break:keep-all;/* 不换行 */
    white-space:nowrap;/* 不换行 */
    overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
    text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用。*/
}

 03.多行显示省略号

/* 多行显示省略号 */
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;     //行数
display: -webkit-box;
overflow: hidden;