首页 > 编程开发 > CSS    日期:2024-01-24 / 来自互联网 / 浏览

在我们日常的网页中,尤其是新闻类的网页会遇到许多类似于这样的样式

css样式对单行和多行文本的隐藏

多行甚至单行的文本隐藏+上省略号标题。

解决这一办法,需要利用css的样式进行改变

如下代码的演示:

单行文本隐藏:

css样式对单行和多行文本的隐藏css样式对单行和多行文本的隐藏

多行文本隐藏:

css样式对单行和多行文本的隐藏css样式对单行和多行文本的隐藏

主要知识点:

1、单行文本隐藏省略:文本不能换行、超出部分隐藏、超出部分省略

2、多行文本隐藏省略:需要利用display改变标签的属性,使其变为弹性盒子并垂直排序、保留对应的行数、最后将超出部分进行隐藏

觉得上面的内容有用吗?快来点个赞吧!

点赞() 我要打赏

温馨提示 : 本站内容来自会员投稿以及互联网,所有源码及教程均为作者总结编辑,请大家在使用过程中提前做好备份,以免发生无法预知的错误,源码类教程请勿直接用于生产环境!

 可能感兴趣的文章

1 2 3 4 5