当前位置: 首页 > news >正文

多行文本省略

方式1

兼容性不好

height: 100px;
line-height: 25px;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 4;

方式2

利用浮动环绕、空白元素站位+margin-top调整位置

<div class="wrap"><div class="more">...</div><div class="content">what is my romm,so that you can catch up width.all right what is my romm,so that 很多文字</div>
</div>.wrap{height: 100px;overflow: hidden;}.wrap::before {content: '';display: block;height: 80px;}.more {float: right;// 浮动位置不对可以调整// position: relative;// top: -3px;}.content {line-height: 25px;margin-top: -80px;}
http://www.xdnf.cn/news/304813.html

相关文章:

  • oceanbase不兼容SqlSugarCore的问题
  • 【KWDB创作者计划】_通过一篇文章了解什么是 KWDB(KaiwuDB)
  • JMeter_配置元件之随机变量(RandomVariable)介绍
  • 手撕算法(1)
  • 使用 Spring Boot 构建 REST API
  • SpringBoot教学管理平台源码设计开发
  • leetcode 24. 两两交换链表中的节点
  • 分库分表后复杂查询的应对之道:基于DTS实时性ES宽表构建技术实践
  • 简说Policy Gradient (1) —— 入门
  • [蓝桥杯 2025 省 B] 水质检测(暴力 )
  • python--------修改桌面文件内容
  • 第2章 神经网络的数学基础
  • 神经网络之激活函数:解锁非线性奥秘的关键
  • Linux开发工具【上】
  • 2025年LangChain(V0.3)开发与综合案例
  • 接口自动化工具如何选择?以及实战介绍
  • windows操作系统开机自启(自动启动) 运行窗口 shell:startup 指令调出开机自启文件夹
  • 驱动开发系列57 - Linux Graphics QXL显卡驱动代码分析(四)显示区域绘制
  • 使用原生javascript手动实现一个可选链运算符
  • [论文阅读]MCP Guardian: A Security-First Layer for Safeguarding MCP-Based AI System
  • 【Spring Boot 注解】@Configuration与@AutoConfiguration
  • vue2项目中使用pag格式动图
  • GMRES算法处理多个右端项的Block与PseudoBlock变体
  • 【已解决】Neo4j Desktop打不开,不断网解决
  • 一种基于条件生成对抗网络(cGAN)的CT重建算法
  • Hadoop架构再探讨
  • keil+vscode+腾讯ai助手
  • 【prometheus+Grafana篇】基于Prometheus+Grafana实现Linux操作系统的监控与可视化
  • 【程序员AI入门:基础】5.提示工程怎么释放LLM的潜力
  • WT2606B显示驱动TFT语音芯片IC:重塑电子锁交互体验的技术革新