用途:为 Tailwind CSS 中的边框样式提供完整参考,适用于设置元素边框、圆角、焦点轮廓/ring,以及子元素之间的 divide-* 分隔线。
主要能力: 边框宽度:border、border-x、border-y、border-t、border-r、border-b、border-l,以及逻辑边框 border-s、border-e、border-bs、border-be(block-start/end,自 v4.2 起)。 边框颜色:border-{color} 及按边设置颜色。 边框样式:border-solid、border-dashed、border-dotted、border-double。 圆角:rounded、rounded-t、rounded-r、rounded-b、rounded-l、rounded-tl、rounded-tr、rounded-bl、rounded-br、rounded-full。 轮廓:outline、outline-{width}、outline-{color}、outline-offset。 Ring:ring、ring-{width}、ring-{color}、ring-offset、ring-offset-{color}。 分隔线:divide-x、divide-y、divide-{color}、divide-{style}。 支持响应式与状态变体,以及通过设计令牌使用完整调色板。
v4 更新:v4.0 中默认 ring 宽度由 3px 改为 1px,如需 v3 行为可使用 ring-3;v4.2 新增逻辑块轴边框 border-bs-* / border-be-*;增强 outline 自定义与 outline-offset;改进按角圆角类;任意值中使用 CSS 变量提升类型安全。
详细参考:border.md 用于边框宽度/颜色/样式、圆角或按边边框;outline.md 用于焦点与可访问性状态下的轮廓宽度/颜色/偏移;ring.md 用于基于 box-shadow 的 ring 或子元素 divide-* 分隔线。
限制:资料未提供安装步骤、价格、平台兼容性或具体代码示例,暂未提供。