CSS [单行省略] [多行省略]

单行省略

{
    white-space: nowrap;      /* 文本不换行 */
    overflow: hidden;         /* 溢出的部分隐藏 */
    text-overflow: ellipsis;  /* 溢出的文本使用...表示 */
}

---

多行省略

{
    display: -webkit-box;          /* 设置为弹性伸缩盒子 */
    overflow: hidden;
    -webkit-line-clamp: 2;         /* 表示在第几行进行文字省略 */
    -webkit-box-orient: vertical;  /* 从上到下垂直排列子元素 */
}

-webkit-box-orient 用于设置子元素按照水平或垂直排列，vertical 表示 从上到下垂直排列子元素