css 實現div內顯示兩行或三行，超出部分用省略號顯示

一、div內顯示一行，超出部分用省略號顯示

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

二、div內顯示兩行或三行，超出部分用省略號顯示

    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;（行數）
    -webkit-box-orient: vertical;

三、表格中單行超出隱藏

table{width:100%;table-layout:fixed;/* 只有定義了表格的布局算法為fixed，下面td的定義才能起作用。 */}
td{
width:100%;
word-break:keep-all; // 不換行
white-space:nowrap; // 不換行
overflow:hidden;
text-overflow:ellipsis;
}

 四、span超過換行

span{
    white-space: nowrap;  /*強制span不換行*/
    display: inline-block;  /*將span當做塊級元素對待*/
    width: 100%;  /*限制寬度 可設px*/
    overflow: hidden;  /*超出寬度部分隱藏*/
    text-overflow: ellipsis;  /*超出部分以點號代替*/
}

轉載自：https://www.cnblogs.com/v616/p/11281855.html

https://blog.csdn.net/qq_43962582/article/details/123015119

https://www.csdn.net/tags/MtTakg2sMDA0MTktYmxvZwO0O0OO0O0O.html