显示省略号
作者:程序员11 时间:2021-03-22 人气:412 QQ交流群\邮箱:1003265987@qq.com
一行显示,超出显示省略号,两行显示,超出显示省略号
要展示的内容
一行超出显示省略号代码:
white-space: nowrap;文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。 overflow: hidden;内容会被修剪,并且其余内容是不可见的。 text-overflow: ellipsis;显示省略符号来代表被修剪的文本。
两行超出显示省略号代码:
white-space: pre-wrap;保留空白符序列,但是正常地进行换行 word-break: break-all;允许在单词内换行。 overflow: hidden;内容会被修剪,并且其余内容是不可见的。 -webkit-line-clamp: 2;用来限制在一个块元素显示的文本的行数。 为了实现该效果,它需要组合其他的WebKit属性。常见结合属性: text-overflow: ellipsis;显示省略符号来代表被修剪的文本。 display: -webkit-box;必须结合的属性 ,将对象作为弹性伸缩盒子模型显示 -webkit-box-orient: vertical;必须结合的属性 ,设置或检索伸缩盒对象的子元素的排列方式
温馨提示:
欢迎阅读本文章,觉得有用就多来支持一下,没有能帮到您,还有很多文章,希望有一天能帮到您。