如何为固定行数的文本设置元素高度
如何为固定行数的文本设置元素高度
提问于 2010-09-09 18:12:37
给定一些占据大约10行的文本，我如何调整其容器的大小，使其只显示前3行，而隐藏其他行？显然这是可行的，但我认为它并不可靠：
.container {
height: 7.5ex; /* 2.5ex for each visible line */
overflow: hidden;
}我可以依赖于height of one row = 2.5ex这一事实吗?或者这只是我用来测试的浏览器中的一个巧合？
回答 4
Stack Overflow用户
回答已采纳
发布于 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;
}Stack Overflow用户
发布于 2010-09-09 18:20:08
您可以设置文本的行高，使用它可以知道每行的确切高度并设置容器的所需高度，只需执行以下操作：
.container {
line-height:25px;
height:75px;
overflow:hidden;
}现在一切都正常工作了:)
Stack Overflow用户
发布于 2017-09-07 21:02:41
您可以使用webkit属性line-clamp
.container {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}它并不能在所有浏览器上工作，但希望有一天它能工作。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/3675623
复制相关文章
相似问题