CSS 文字溢出:多行溢出、一行溢出

CSS 文字溢出:多行溢出、一行溢出

案例请点击查看文章详情。


代码如下:

  • 多行溢出设置

    css 复制代码
    .line-clamp-2{
    	/* height: 52px;
    	line-height: 25px; */
    	overflow: hidden;
    	word-break: break-all;
    	text-overflow: ellipsis;
    	display: -webkit-box;
    	-webkit-line-clamp: 2;
    	-webkit-box-orient: vertical;
    }
  • 单行溢出设置

    css 复制代码
    line-height: 25px;
    overflow: hidden;(文字长度超出限定宽度,则隐藏超出的内容)
    white-space: nowrap;(设置文字在一行显示,不能换行)
    text-overflow: ellipsis;(规定当文本溢出时,显示省略符号来代表被修剪的文本)

    text-overflow: ellipsis; 文本溢出隐藏

相关推荐
莪_幻尘3 分钟前
你的 AI Skill 越多越蠢?Token 上下文爆炸的求生指南
前端·ai编程
lichenyang45328 分钟前
从 has.echo 到异步 API 注册表:一次 ASCF API 回调不触发的排查复盘
前端
林瞅瞅35 分钟前
Nuxt3 项目部署 Nginx 防盗链后特定 JS 文件 403 问题修复方案
前端
kyriewen1 小时前
别再每次都 Google 了:我整理了前端日常最常踩的 10 个 Git 坑,附速查表
前端·javascript·git
一颗奇趣蛋1 小时前
Web 视频开发完全指南:从入门到精通
前端
非洲农业不发达2 小时前
windows终端体验大升级,让你拥有macos级别的美化
前端·后端
妙码生花2 小时前
从 PHP 到 AI + Golang,程序员自救转型手记(十七):登录接口完善,登录页接口整合,解决跨域
前端·后端·ai编程
唐诗2 小时前
改 3 行配置,我的 Tauri dev 冷启动从 100 秒干到 4 秒
前端·客户端
SmartBoyW2 小时前
深入ECMAScript规范:彻底搞懂JS隐式类型转换与底层ToPrimitive机制
前端·javascript
牧艺2 小时前
Cursor Rules / Skills 分层设计:让 Agent 像「团队新同事」
前端·人工智能·cursor