Tailwindcss文本溢出

单行文本溢出

如果只定义一行文本溢出，直接使用 tailwindcss 定义的类即可

<div className="truncate">{itemData.name}</div>

多行文本溢出

安装插件

pnpm add @tailwindcss/line-clamp

• 在 tailwind.config.js 中导入插件

/** @type {import('tailwindcss').Config} */
module.exports = {
  ...
  plugins: [require('@tailwindcss/line-clamp')]
}

• 使用

<div className="line-clamp-2">{itemData.name}</div>