3

「バイオ」をエコーアウトするテキストエリアボックスがあります-「バイオ」はデータベースからのテキストコンテンツです。

また、このテキスト領域の横に css ボックスがあり、テキストを 3 行に制限して、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.
4

1 に答える 1

10

これを試すことができます:

.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;
    }
}

重複した質問から: CSS を使用してテキストの長さを n 行に制限する

于 2013-03-12T20:32:52.597 に答える