kebab-case 转换器
把 camelCase、snake_case 或普通文本转换为 kebab-case(短横线命名),用于 CSS 类名、URL 和文件名。处理缩写词和数字,逐行转换。
示例:userAccountId → user-account-id
每一行单独转换。单词按空格、标点、_ - . / 以及驼峰边界拆分;XML 这类缩写保持完整,数字跟随前一个单词。
相关工具
查看全部什么是 kebab-case 转换?
这个工具把标识符和短语转换为 kebab-case(也叫 dash-case,烤串命名):小写单词用连字符连接,用于 CSS 类名、HTML 属性、命令行参数和 URL 路径。
如何使用 kebab-case 转换
- 在 输入 框中输入或粘贴文本,每行一个标识符或短语(或点击 加载示例)。
- 转换后的文本会立即显示在 输出 框中。
- 点击 复制 复制结果。
示例
getHTTPResponseCode
get-http-response-code
何时使用 kebab-case 转换
适合 CSS 类名、组件文件名或命令行选项。如果要根据带重音的标题生成利于 SEO 的 URL,去除变音符号的 slug 生成器是更好的选择。
kebab-case 转换 的工作原理
输入先被拆分为单词,每个单词转为小写,再用 - 连接。单词在空格、标点和分隔符 _ - . / 处拆分,也会在标识符内部的大小写变化处拆分:fooBar → foo + Bar,连续的缩写词会保持在一起(XMLHttpRequest → XML + Http + Request)。数字会附着在它前面的单词上(Request2Go → Request2 + Go),单词内的撇号会被去掉(don't → dont),并支持任何文字的字母(é、ñ、西里尔字母、希腊字母等)。每一行都会单独转换。
常见用例
- 根据组件名生成 CSS 类名
- 把 React 组件名转换成文件名
- 生成命令行选项名
- 根据标识符构建 URL 路径段
安全提示
所有处理都在你的浏览器本地完成,粘贴的内容不会被上传。
常见问题
kebab-case 和 slug 一样吗?
相似,但本工具会保留带重音的字母;slug 生成器通常会把它们音译成 ASCII。
缩写词如何处理?
getHTTPResponseCode 会变成 get-http-response-code。
支持多行吗?
支持,每一行都会单独转换。