1.多行文本截断
width: 100px;
word-break: break-all;
text-overflow: ellipsis;
display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/
-webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
-webkit-line-clamp: 1; /** 显示的行数 **/
overflow: hidden; /** 隐藏超出的内容 **/
2.清楚浮动
display: table;
content: " ";
clear: both;
本文介绍了一种使用CSS实现多行文本自动截断的方法,并展示了一个简单的清除浮动的技巧。对于文本截断,通过设置特定的CSS属性如`text-overflow:ellipsis;`、`-webkit-line-clamp:1;`等,可以使溢出的文本以省略号形式显示,同时限制显示的行数。清除浮动方面,通过创建一个空的table单元格并设置`clear:both;`来达到目的。
902

被折叠的 条评论
为什么被折叠?



