Tailwind CSS Blog
·
Tailwind CSS v4.0
💡
原文英文，约2700词，阅读约需10分钟。
📝
内容提要
Tailwind CSS v4.0正式发布，重写框架以提升性能和灵活性，支持现代CSS特性。新配置方式简化了使用流程，构建速度显著提升，新增渐变、3D变换等功能，并支持容器查询。
🎯
关键要点
- Tailwind CSS v4.0正式发布，重写框架以提升性能和灵活性。
- 新版本支持现代CSS特性，简化配置和自定义体验。
- 全新配置方式减少了使用步骤，构建速度显著提升。
- 全量重建速度提升超过3.5倍，增量构建速度提升超过8倍。
- 新增CSS @layer、注册自定义属性和color-mix()等现代CSS特性。
- 简化了安装过程，用户可以通过一行CSS开始使用Tailwind。
- 支持自动检测内容，无需手动配置内容数组。
- 配置方式从JavaScript转移到CSS，减少了项目中的文件数量。
- 设计令牌默认作为CSS变量提供，便于在运行时引用。
- 新增的渐变功能支持角度值和颜色插值模式。
- 引入容器查询支持，简化响应式设计。
- 新增3D变换API，支持多种3D效果。
- 新增多种实用工具和变体，包括阴影、字段大小和颜色方案等。
- Tailwind CSS v4.0是多年的努力成果，期待用户的反馈和使用。
❓
延伸问答
Tailwind CSS v4.0有哪些主要改进？
Tailwind CSS v4.0进行了全面重写，提升了性能和灵活性，支持现代CSS特性，构建速度显著提升，并简化了配置和自定义体验。
如何开始使用Tailwind CSS v4.0？
用户可以通过一行CSS安装Tailwind CSS v4.0，具体步骤包括安装npm包并在CSS中导入Tailwind。
Tailwind CSS v4.0的构建速度提升了多少？
全量重建速度提升超过3.5倍，增量构建速度提升超过8倍，某些增量构建速度提升超过100倍。
Tailwind CSS v4.0支持哪些现代CSS特性？
新版本支持CSS @layer、注册自定义属性、color-mix()等特性，并引入了容器查询和3D变换API。
Tailwind CSS v4.0如何简化配置过程？
配置方式从JavaScript转移到CSS，用户可以直接在CSS文件中进行配置，减少了项目中的文件数量。
Tailwind CSS v4.0新增了哪些实用工具和变体？
新增了阴影、字段大小、颜色方案等多种实用工具和变体，增强了设计灵活性。
➡️
