CSS实现文本最多展示两行,超出省略,但是在短横线处意外换行了,我希望最多展示两行,超出两行再省略,短横线不换行
时间: 2023-06-09 13:03:52 浏览: 169
CSS文本超出div或者span时用省略号代替
您可以使用CSS中的text-overflow属性来实现文本省略,并使用white-space属性设置文本的显示方式。例如,使用以下样式代码:
```
.your-element-class {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
max-height: 2em;
line-height: 1em;
}
```
这将使文本最多展示两行,超出两行后将被省略,短横线也不会导致意外换行。请注意,您需要为元素设置固定的高度(例如,max-height: 2em),并将line-height设置为文本的行高以确保文本正确地居中。
阅读全文