ddddd

显示省略号

作者:程序员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;必须结合的属性 ,设置或检索伸缩盒对象的子元素的排列方式


温馨提示:

欢迎阅读本文章,觉得有用就多来支持一下,没有能帮到您,还有很多文章,希望有一天能帮到您。

显示省略号---相关文章


评论区

ddddd

程序员-学习的网站-想学习编程的码农可以进来看看

首页

视频教程

购物车

我的订单