用途:为 Tailwind CSS 项目的配置、迁移与扩展提供知识参考。建议先阅读迁移说明,再按需查阅对应主题。
主要能力与内容:
- 配置与主题:@theme、令牌命名空间、源检测、旧版配置与自定义工具类。
- 集成与生态:@reference、包别名、Vite、webpack、Tailwind Plus、Prettier。
- 迁移与兼容:更名、移除的配置项、浏览器回退、逻辑属性迁移。
- 工具类:渐变、遮罩、阴影、换行、对齐、逻辑属性、滚动条、容器。
- 变体与状态:data 与祖先状态、负向变体、指针、校验、details、popover、CSS 变体组合。
必要用法(迁移要点):
- 使用 CSS 优先入口:@import "tailwindcss"; 并在顶层 @theme 中定义令牌,例如 --color-brand、--breakpoint-3xl。仅写 :root 自定义属性不会生成工具类或变体。
- 旧版 JS 配置与插件仅通过 @config 和 @plugin 桥接。
- 不再支持 corePlugins、safelist、separator;safelist 改用 @source inline()。
- 更名与弃用类:bg-gradient-to-r 改为 bg-linear-to-r;start-* 改为 inset-s-;end- 改为 inset-e-*。
- 兼容行为:回退覆盖 oklab、带透明度的颜色以及阴影、变换、渐变使用的已注册自定义属性;显式渐变插值在不受支持时降级为浏览器默认,需在旧浏览器上测试视觉效果。
适用场景:Tailwind CSS 项目配置、从旧版本迁移、扩展主题与工具类、处理兼容性问题。 限制:以上为知识参考内容,具体项目行为与浏览器支持情况暂未提供更多细节,需以实际测试为准。