首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

技巧:文本超过N折叠内容显示“...查看全部”

作者:MUMA https://wintc.top/article/58 多行文本超过指定行数隐藏超出部分并显示“...查看全部”是一个常遇到的需求,网上也有人实现过类似的功能,不过还是想自己写写看...n(比如3),不超过n正常显示;超过n则在最后一尾部显示“展开”或“查看全部”之类的按钮,点击按钮则展开显示全部内容,或者跳转到其它页面展示所有内容。...最直观的想法就是直接遍历,让x从0开始增长到显示文本总长度,对于每个x值,都计算一次文字是否超过N,没超过则加继续遍历,超过则获得了合适的长度x - 1,跳出循环。...第一次先以文本长度为截取长度,计算是否超过N,没超过则停止计算;超过则取1/2长度进行截取,如果此时没超过N,则在1/2长度到文本长度之间继续二分查找,如果超过则在0到1/2文本长度中继续二分查找。...支持HTML串的考虑 现在的实现方案并不支持内容是HTML文本,如果需要支持HTML文本,问题将复杂许多。主要在于HTML字符串的解析和截断,不像文本字字符串那么简单。

2.5K10

技巧:文本超过N折叠内容显示“...查看全部”

作者:MUMA https://wintc.top/article/58 多行文本超过指定行数隐藏超出部分并显示“...查看全部”是一个常遇到的需求,网上也有人实现过类似的功能,不过还是想自己写写看,...n(比如3),不超过n正常显示;超过n则在最后一尾部显示“展开”或“查看全部”之类的按钮,点击按钮则展开显示全部内容,或者跳转到其它页面展示所有内容。...最直观的想法就是直接遍历,让x从0开始增长到显示文本总长度,对于每个x值,都计算一次文字是否超过N,没超过则加继续遍历,超过则获得了合适的长度x - 1,跳出循环。...第一次先以文本长度为截取长度,计算是否超过N,没超过则停止计算;超过则取1/2长度进行截取,如果此时没超过N,则在1/2长度到文本长度之间继续二分查找,如果超过则在0到1/2文本长度中继续二分查找。...支持HTML串的考虑 现在的实现方案并不支持内容是HTML文本,如果需要支持HTML文本,问题将复杂许多。主要在于HTML字符串的解析和截断,不像文本字字符串那么简单。

2.1K20

Linux tail命令:显示文件结尾的内容

命令正好相反,它用来查看文件末尾的数据,其基本格式如下: [root@localhost ~]# tail [选项] 文件名 此命令常用的选项及含义 【例 1】查看 /etc/passwd 文件最后 3 的数据内容...【例 2】查看 /etc/passwd 文件末尾 100 个字节的数据内容。...[root@localhost ~]# tail -c 100 /etc/passwd cpdump:x:72:72::/:/sbin/nologin 【例 3】 监听文件的新増内容。...oddjob sgpio certmonger pam_krb5 krb5-workstation perl-DBD-SQLite %end #光标不会退出文件,而会一直监听在文件的结尾处 这条命令会显示文件的最后...10 行内容,而且光标不会退出命令,每隔一秒会检查一下文件是否增加新的内容,如果增加就追加到原来的输出结果后面并显示

22290

CSS 控制内容显示行数

代码示例 ---- 显示内容,超出部分使用省略号表示(只有块元素才会生效) .nowrap { white-space: nowrap; text-overflow: ellipsis; overflow...: hidden; } 显示两行内容,超出部分使用省略号表示 .line-clamp-2 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box...; -webkit-box-orient: vertical; -webkit-line-clamp: 2; /* 显示行数 */ } 解决英文和数字不会自动换行的问题 word-break: break-all...代码解析 ---- -webkit-line-clamp 用于限制块元素显示文本的行数,它是一个不规范的属性,没有出现在 CSS 规范草案中。...为了实现限制文本的行数,需要组合其他 webkit 属性,常见结合属性: /* 将对象作为弹性伸缩盒子模型显示 */ display: -webkit-box; /* 设置或检索伸缩盒对象的子元素的排列方式

2.6K20

Linux 打印文本部分行内容(前几行,指定,中间几行,跨行,奇偶,后几行,最后一,匹配

背景 打印对账文件最后一汇总信息,通过钉钉定时发送到运维群。顺便总结下 Linux 打印文本部分行内容的各种方法。...测试文本 # 生成测试文本内容 $ seq -f "%02g daodaotest" 1 10 > test.txt # 查看测试文本内容,并显示行号 $ cat -n test.txt 1...5~10 行内容 $ tail -n +5 test.txt | head -6 打印跨行内容 # sed 打印第 3 和 5~7 行内容 $ sed -n '3p;5,7p' test.txt...# tail 打印后 5 行内容 $ tail -5 test.txt $ tail -n 5 test.txt 打印最后一内容 # tail 打印最后一内容 $ tail -n 1 test.txt...# sed 打印最后一内容 $ sed -n '$p' test.txt # awk 打印最后一内容 $ awk 'END {print}' test.txt 打印匹配行内容 # 打印以 "

12.6K32

linux使用cat命令在终端设备上显示文件内容

Linux系统中有很多个用于查看文件内容的命令,每个命令又都有自己的特点,比如这个cat命令就是用于查看内容较少的纯文本文件的。...注意:当文件内容较大时,文本内容会在屏幕上快速闪动(滚屏),用户往往看不清所显示的具体内容。...显示版本信息 参考实例 查看文件的内容: [root@linux ~]# cat filename.txt 查看文件的内容,并显示行数编号: [root@linux ~]# cat -n filename.txt...查看文件的内容,并添加行数编号后输出到另外一个文件中: [root@linux ~]# cat -n linuxcool.log > linuxprobe.log 清空文件的内容: [root@linux...~]# cat /dev/null > /root/filename.txt 持续写入文件内容,碰到EOF符后结束并保存: [root@linux ~]# cat > filename.txt <<EOF

3.4K40
领券