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; 文本溢出隐藏

相关推荐
乘风gg13 小时前
当 AI 遇到私有组件,Cli 才是 AI Coding 的起点
前端·ai编程·cursor
40岁搬砖工13 小时前
直观高效的 VSCode 略缩图定位注释 MARK
前端
前端开发爱好者13 小时前
支持 110 种文件预览!兼容 Vue、React、Svelte!
前端·javascript·vue.js
陈随易14 小时前
VSCode古法神器fnMap v9开发故事
前端·后端·程序员
大家的林语冰15 小时前
👍 尤大重学 Webpack,Vite 8.1 再进化,打包模式复活!
前端·javascript·vite
张元清15 小时前
React useIsomorphicLayoutEffect:修掉 SSR 下的 useLayoutEffect 警告(2026)
前端·javascript·面试
PBitW15 小时前
直接让GPT每日训练我!!!😕😕😕
前端·javascript·面试
爱勇宝15 小时前
我给自己做了一个新标签页:不登录、不打扰、打开就能用
前端·html·浏览器
Ausra无忧16 小时前
记录在公司把单服务器升级成多服务器架构流程
前端·后端·架构
极客密码16 小时前
来看看我用Codex两周时间vibe coding的这款轻量级的剪贴板管理应用,win/mac系统均可用
前端·ai编程·vibecoding