Tailwind CSS v1.9.0
内容提要
Tailwind CSS v1.9发布，新增配置预设、CSS网格工具、扩展边框半径、旋转和倾斜比例、可配置焦点指示器等功能。用户可自定义基础配置，便于团队共享品牌样式。网格工具可控制自动生成的列和行大小，改进的焦点指示器提高可访问性。升级过程简单，建议用户提前适应未来版本的变化。
延伸解读
配置预设：团队样式共享的解决方案
Tailwind CSS v1.9 引入的 presets 功能允许在 tailwind.config.js 中指定自定义基础配置，替代默认的 Tailwind 基础配置。对于需要统一品牌颜色、字体或间距的团队，可以将共享配置发布为 npm 包，并在多个项目中通过 presets 引入。多个预设会按顺序合并，项目特定配置的合并逻辑与默认配置一致，extend 等特性仍然有效。
网格自动尺寸工具：控制隐式轨道
新增的 gridAutoColumns 和 gridAutoRows 核心插件提供了 auto-cols-* 和 auto-rows-* 工具类，用于设置 grid-auto-columns 和 grid-auto-rows 属性。当网格未显式指定列或行数量时，这些工具可以控制隐式创建的轨道尺寸。默认包含响应式变体，并可在配置文件的 gridAutoColumns 和 gridAutoRows 部分自定义。
焦点指示器改进：兼顾可访问性与设计
outline-none 类现在默认渲染透明轮廓，而非无轮廓，这有助于 Windows 高对比度模式下基于 box-shadow 的焦点样式可见。新增的 outline-white 和 outline-black 提供 2px 点状轮廓并带 2px 偏移，分别适用于深色和浅色背景，确保足够的对比度。outline 属性也可配置，支持自定义轮廓及偏移值。
升级建议：非破坏性更新与未来准备
v1.9 是非破坏性的次要版本，升级只需运行 npm install tailwindcss@^1.9 或 yarn add tailwindcss@^1.9。此外，两个先前实验性功能 defaultLineHeights 和 standardFontWeights 已提升为 future，建议现在选择启用，以简化今年秋季升级到 Tailwind CSS v2.0 的过程。
Q&A
Tailwind CSS v1.9有哪些新功能？
Tailwind CSS v1.9新增了配置预设、CSS网格工具、扩展边框半径、旋转和倾斜比例、改进的焦点指示器等功能。
如何使用Tailwind CSS v1.9的配置预设功能？
用户可以在tailwind.config.js文件中添加presets键，定义自定义基础配置，以便团队共享品牌样式。
Tailwind CSS v1.9的网格工具有什么用？
新增的grid-auto-columns和grid-auto-rows工具可以控制自动生成的列和行大小，便于设置默认的列/行大小。
焦点指示器的改进如何提高可访问性？
改进后的焦点指示器默认渲染透明轮廓，新增outline-white和outline-black样式，帮助低视力用户更好地识别选中的元素。
如何升级到Tailwind CSS v1.9？
升级过程简单，只需运行npm install tailwindcss@^1.9或yarn add tailwindcss@^1.9即可。
Tailwind CSS v1.9中新增的边框半径和旋转工具有哪些？
新增了rounded-xl、rounded-2xl、rounded-3xl等边框半径工具，以及多个旋转和倾斜的实用工具。
