Question

我有一个textarea框，回复'bio' - 'bio'是我数据库中的文本内容。

此文本区域旁边还有一个css框，并想知道如何将文本限制为三行，然后在CSS框下面继续。

这是一个图表：

_ _ _ _ _ _ _ _ _ _
|                  |   Bio Content Goes Here
|                  |   blah, blah, blah, blah     
- - - - - - - - - -    blah, blah, blah, blah  
Content carrys on here, here, here and here etc.
Content carrys on here, here, here and here etc.

Answer 1

你可以试试这个：

.yourBox {
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: X;
    max-height: X*N
}

@media (-webkit-min-device-pixel-ratio: 0) {
    .yourBox {
        display: -webkit-box;
        -webkit-line-clamp: N; /* number of lines to show */
        -webkit-box-orient: vertical;
    }
}

来自重复的问题：Limit text length to n lines using CSS

按CSS中的行数限制文本

1 个答案: