@tailwindcss/forms 不读取 theme.extend.forms 配置，因其未接入 Tailwind 主题解析流程，所有样式硬编码在插件内部；修改表单样式必须用 @layer base 自定义 CSS 覆盖，且需兼顾可访问性。
直接改 tailwind.config.js 里的 theme.extend.forms 没用——@tailwindcss/forms 根本不读这个配置项，所有样式硬编码在插件内部。
为什么 extend.forms 完全无效
插件设计上就没暴露 forms 这个 theme key。你在 theme.extend 里写 forms: { ... }，Tailwind 编译器会直接忽略它。这不是配错，是插件本身没接入 theme 解析流程。它只在 @layer base 层注入 CSS，不参与任何配置扩展。
常见错误现象：
– 写了 extend: { forms: { control: { borderColor: '#94a3b8' } } } 却毫无反应
– 在 DevTools 里搜不到对应 CSS 规则
– 表单控件边框、焦点环颜色始终是默认蓝
- 插件源码里所有样式（比如
input[type="checkbox"] { appearance: none; background: transparent; }）都是静态写死的 - 想改颜色、尺寸、焦点环粗细，必须自己写 CSS 覆盖，且优先级要压过插件原生规则
- 不能依赖
@apply或工具类组合来“覆盖”，因为插件样式不在工具类体系内
如何安全覆盖 input/select/checkbox 的焦点与边框
插件默认给 input、select、textarea 加了 focus:ring-2 focus:ring-blue-500 focus:ring-offset-2，但这只是示例工具类，不是源头；真正生效的是它注入的 base 层 CSS 规则。
立即学习“前端免费学习笔记（深入）”；
- 在
app.css或主样式文件中，用@layer base包裹自定义规则，否则会被插件样式覆盖 - 聚焦选择器必须严格匹配插件写法，例如：
[type='text']:focus, [type='email']:focus, select:focus, textarea:focus - 别直接写
outline: none——这会让键盘用户失去焦点指示；应重设--tw-ring-color变量或显式定义outline - Safari 下
select箭头残留？补一句：background-image: url("data:image/svg+xml,..."); background-repeat: no-repeat; background-position: right 0.75rem center;
为什么 peer-checked:bg-blue-500 不生效
不是 class 写错了，而是结构或定位缺失导致 peer 机制失效。
-
peer要求复选框必须是兄弟节点中前一个元素，且必须是裸<input type="checkbox">，不能套在<div> 里再加 class <li>父容器没设 <code>relative？peer-checked:xxx类不会触发定位上下文，伪元素偏移会错位 - 插件已把原生 checkbox 设为
appearance-none和全透明，你得自己用before:content-[""] + absolute画勾选标记 - 别忘了保留
:checked语义——屏幕阅读器依赖它，光靠视觉样式不够 - 若仅想局部绕过插件，不要动
corePlugins.preflight，那会连box-sizing: border-box都丢掉 - 更稳妥的做法是在
@layer base里针对性覆盖，比如重写input:focus、select:focus、input[type="checkbox"]::before - 所有自定义规则必须放在
@tailwind base之后、@tailwind components之前，否则顺序错乱 - 别在
@layer base里用@apply带响应式变体（如sm:border），它们不会生效
禁用预设重置后怎么补基础样式
如果真想彻底摆脱插件控制，唯一办法是关掉 @tailwindcss/forms 并手动管理表单样式。但注意：关掉插件 ≠ 关掉 Tailwind 的 preflight，后者还会影响 button、img 等全局行为。
最难的部分从来不是让 checkbox 看起来像设计稿，而是让它在高对比度模式下有足够对比、在键盘 tab 时有清晰焦点、在 VoiceOver 下正确播报状态——@tailwindcss/forms 只清掉了浏览器默认样式，可访问性得你亲手补全。
