单行文本省略

overflow: hidden;/* 文本溢出限定的宽度就隐藏内容 */
white-space: nowrap;/* 设置文本不换行 */
text-overflow: ellipsis;/* 省略号隐藏溢出范围的文本 */
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;

多行文本省略

-webkit-line-clamp: 2;/* 限制文本行数 */
display: -webkit-box;/* 将对象作为弹性伸缩盒子模型显示 */
-webkit-box-orient: vertical;/* 设置或检索伸缩盒对象的子元素的排列方式 */
overflow: hidden;/* 文本溢出限定的宽度就隐藏内容 */
text-overflow: ellipsis;/* 省略号隐藏溢出范围的文本 */
-webkit-line-clamp: 2;
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
文章目录