<p>css文本溢出显示省略号css文本溢出显示省略号css文本溢出显示省略号css文本溢出显示省略号css文本溢出显示省略号</p>
1、单行文本溢出,添加以下样式:
p {
background-color: #ccffcc;
width: 300px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
展示效果如下:
2、多行文本溢出,添加以下样式:
p {
background-color: #ccffcc;
width: 300px;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
展示效果如下:
注:其中-webkit-line-clamp: 2;代表超过两行的文本溢出用省略号表示。