css-文本单行、多行溢出省略

单行溢出：

width:690rpx;/*设置宽度。*/

text-overflow: ellipsis;/*显示省略符号来代表被修剪的文本。*/
white-space: nowrap;/*文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。*/
overflow: hidden;/*内容会被修剪，并且其余内容是不可见的。*/

详细解释：单行文字溢出处理_WLJIAO的博客-CSDN博客_单行溢出css简单实现下图单行文本溢出部分用省略号代替效果当文本内容过多是，默认会自动换行要变为第一张图的效果，只需要给该行文字所在的标签加三个属性text-overflow: ellipsis;/*显示省略符号来代表被修剪的文本。*/white-space: nowrap;/*文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。*/overflow: hidden;/*内容会被修剪，并且其余内容是不可见的。*/text-overflow 用法white-spacehttps://blog.csdn.net/qq_43467284/article/details/108654292

多行溢出：

width: 690rpx; /*设置宽度。*/

height: 300rpx; /*设置宽度。*/

display: -webkit-box;/*将对象作为弹性伸缩盒子模型显示*/
overflow: hidden;/*超出的文本隐藏*/
white-space: normal !important; /*溢出不换行(white-space: nowrap;)*/
text-overflow: ellipsis; /*溢出用省略号显示*/
word-wrap: break-word; /*用来标明是否允许浏览器在单词内进行断句，这是为了防止当一个字符串太长而找不到它的自然断句点时产生溢出现象*/
-webkit-line-clamp: 3; /*这个属性不是css的规范属性，需要组合上面两个属性，表示显示的行数。*/
-webkit-box-orient: vertical; /*从上到下垂直排列子元素（设置伸缩盒子的子元素排列方式）*/