Tailwind CSS 原生不支持 stroke-1、stroke-2 等描边粗细类，stroke- 前缀仅用于颜色；SVG 描边宽度必须用 stroke-width 属性或内联 style 控制，或通过自定义 theme 和插件扩展。
stroke-1 和 stroke-2 在 Tailwind 中根本不存在
Tailwind CSS 默认不提供 stroke-1、stroke-2 这类类名。你搜到的“stroke-1”可能是误记，或是别人自定义的扩展类——原生 Tailwind 的 stroke- 前缀类只用于颜色（如 stroke-gray-500），不控制粗细。
SVG 描边粗细必须用 stroke-width 属性或内联 style
SVG 元素（如 <path></path>、<line></line>、<circle></circle>）的描边宽度由 stroke-width 属性决定，Tailwind 不生成对应工具类。常见错误是以为加个 stroke-2 就能变粗，结果毫无变化。
- 正确写法是直接在 SVG 标签里写：
stroke-width="2"或stroke-width="1.5" - 若需响应式或暗色模式适配，用内联
style绑定：style="stroke-width: clamp(1px, 0.0625rem, 2px)" - 用 Tailwind 的
text-stroke类？不行——那是为普通文本设计的-webkit-text-stroke，对 SVG 路径无效
想用类名控制 stroke-width？得自己配 theme 或插件
如果项目中大量使用固定描边宽度（比如统一 1.5px），可以扩展 theme.strokeWidth 并启用 strokeWidth 插件（需 Tailwind v3.4+）：
module.exports = {
theme: {
extend: {
strokeWidth: {
'1': '1',
'1.5': '1.5',
'2': '2',
}
}
},
plugins: [require('@tailwindcss/forms'), require('@tailwindcss/typography')]
}
之后才能用 stroke-[1.5]（arbitrary value）或自定义类如 .stroke-1\.5 { stroke-width: 1.5; }。但注意：stroke-[1.5] 需开启 experimental.optimizeUniversalDefaults: true，否则生产环境可能漏生成。
为什么不能用 border- 类模拟 SVG 描边
有人试图用 border + inline-block 包裹 SVG 来“伪造”描边，这不可靠：
-
border是盒模型边框，会撑开布局、影响定位，和 SVG 内部路径描边语义完全不同 - 无法对单个
<path></path>精确控制，更别说动画时的stroke-dasharray计算 - 缩放或 viewBox 不匹配时，border 会失真，而
stroke-width是 SVG 原生单位，随图形等比缩放
真正要动描边粗细，就老老实实写 stroke-width——它不是被 Tailwind “忽略”的功能，而是 SVG 规范层的东西，Tailwind 本就不该也不必接管。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
