学习笔记
文字过长超出时显示省略号
一行超出显示省略号123overflow: hidden;white-space: nowrap;text-overflow: ellipsis;
.test1{
width: 200px;
background: var(--hl-bg);
border: 1px solid var(--heo-fontcolor);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
效果:超出显示省略号超出显示省略号超出显示省略号超出显示省略号超出显示省略号超出显示省略号超出显示省略号
两行(多行)超出显示省略号
显示的行数由 line-clamp 样式的值决定。
123456overflow: hidden;white-space: normal;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;
.test2{
width: 200px ...