给定一些占据大约10行的文本,我如何调整其容器的大小,使其只显示前3行,而隐藏其他行?显然这是可行的,但我认为它并不可靠:
.container {
height: 7.5ex; /* 2.5ex for each visible line */
overflow: hidden;
}
我可以依赖于height of one row = 2.5ex
这一事实吗?或者这只是我用来测试的浏览器中的一个巧合?
发布于 2010-09-09 18:19:07
如果要使用它,则应确保line-height
始终为2.5ex
.container {
line-height: 2.5ex;
height: 7.5ex; /* 2.5ex for each visible line */
overflow: hidden;
}
发布于 2010-09-09 18:20:08
您可以设置文本的行高,使用它可以知道每行的确切高度并设置容器的所需高度,只需执行以下操作:
.container {
line-height:25px;
height:75px;
overflow:hidden;
}
现在一切都正常工作了:)
发布于 2017-09-07 21:02:41
您可以使用webkit属性line-clamp
.container {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
它并不能在所有浏览器上工作,但希望有一天它能工作。
https://stackoverflow.com/questions/3675623
复制相似问题