我想使用html格式只显示下面段落的前3行.我正在搜索w3shool,但它没有显示如何做到这一点.请帮忙
<body>
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlor
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlore
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlore
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlore
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlore
</body>
Run Code Online (Sandbox Code Playgroud)
Jam*_*lly 17
您可以给容器a height并将line-height其overflow属性设置为hidden:
HTML
<p>loremloremlorem...</p>
Run Code Online (Sandbox Code Playgroud)
CSS
p {
height:60px;
line-height:20px; /* Height / no. of lines to display */
overflow:hidden;
}
Run Code Online (Sandbox Code Playgroud)
svi*_*eet 14
将段落的高度设置为三个行高.喜欢 -
p{
line-height:1.2em;
height:3.6em;
overflow:hidden;
}
Run Code Online (Sandbox Code Playgroud)
将溢出设置为隐藏以隐藏溢出的文本
You can use -webkit-line-clamp property with div.
div {
width: 100%;
line-height: 1.2em;
height: 3.6em;
background-color: gainsboro;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}Run Code Online (Sandbox Code Playgroud)
<div>
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlore
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlore
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlore
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlore
loremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremloremlore
</div>Run Code Online (Sandbox Code Playgroud)