最多显示2行文字,多余的省略显示。
·
前端在 CSS 中最多显示 2 行文字，可以使用 overflow: hidden 和 text-overflow: ellipsis 属性，并设置一个高度限制。
例如：
.box {
overflow: hidden;
text-overflow: ellipsis;
// 只要超过宽度就换行，不论中文还是英文
word-break: break-all;
//最多展示两行
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
//根据样式设置
line-height: 1.2em;
max-height: 2.4em;
}
这样，如果文本需要更多的行数才能完全显示，则会省略多余的文本并在末尾显示省略号（...）。
旨在为数千万中国开发者提供一个无缝且高效的云端环境，以支持学习、使用和贡献开源项目。
更多推荐
5
0- 0
已为社区贡献8条内容
所有评论(0)