9

HTML フォーマットを使用して、以下の段落の最初の 3 行のみを表示したいと考えています。W3Schools で検索していますが、その方法が表示されません。

<body>

loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlor
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlore
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlore
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlore
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlore

</body>
4

3 に答える 3

19

コンテナにheightを指定しline-height、そのoverflowプロパティを に設定できhiddenます。

HTML

<p>loremloremlorem...</p>

CSS

p {
    height:60px;
    line-height:20px; /* Height / no. of lines to display */
    overflow:hidden;
}

JSFiddle の例。

于 2013-03-25T10:34:09.410 に答える
16

段落の高さを 3 行の高さに設定します。お気に入り -

p{
  line-height:1.2em;
  height:3.6em;
  overflow:hidden;
}

オーバーフローを非表示に設定して、オーバーフローしたテキストを非表示にします

于 2013-03-25T10:34:23.013 に答える