css多行文字溢出打点

单行文字打点溢出

.showOneRows {
    width: 100px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

多行文字打点溢出

.showMoreRows {
    width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3; //行数
    -webkit-box-orient: vertical;
}

项目使用了bootstrap，所以宽度加在了column属性里面，又由于文本是用p标签包裹的，导致表头塌陷（标题塌陷），所以css 改为如下：

效果图

lALPDgQ9rJGhgj56zQJl_613_122.png