hyphens 连字符断词属性

最后更新：2026-09-13

hyphens hyphens 连字符断词属性

hyphens 属性用于控制浏览器是否在单词内部使用连字符（-）进行断词换行，常见于英文等多音节语言的排版。启用自动断词后，浏览器会根据语言词典在合适的位置插入连字符，让文本在容器边界处更自然地换行，减少参差不齐的空白。

hyphens: none | manual | auto;

值	类型	描述
`none \| manual \| auto`	关键字	连字符断词

编辑下方代码，在 playground 中查看实时效果：

浏览器	Chrome	Edge	Firefox	Safari	Opera
hyphens	✓ v57	✓ v12	✓ v52	✓ v10.1	✓ v44
所有主流浏览器均支持

提示： 自动断词需要 HTML 中设置 lang 属性（如 lang="en"），浏览器根据语言词典决定断词位置。

重要： 使用（软连字符）可以手动指定允许断词的位置，浏览器只在需要时才会显示连字符。

Qhyphens 对中文有效吗？

A中文没有单词边界的概念，hyphens 对中文文本基本无效。中文换行通常使用 word-break 或 overflow-wrap 控制。

Qmanual 和 auto 有什么区别？

Amanual 只在手动指定的位置（软连字符）断词；auto 由浏览器根据语言词典自动选择断词位置，更智能但需要正确的 lang 属性。

Q如何让英文文本自动断词换行？

A设置 hyphens: auto，并确保 HTML 有正确的 lang 属性（如 lang="en"），浏览器会按语言词典在词尾添加连字符断行。hyphens 只在单词放不下时才断行，配合 text-align: justify 效果最好。

Qhyphens 的浏览器兼容性如何？

A现代浏览器均支持，但 iOS Safari 需要加 -webkit-hyphens 前缀。由于依赖语言词典，同一条文本在不同语言环境下的断词位置可能不同。

Web-Tutorial 技术团队

由多位开发者共同维护的编程教程平台。每篇教程由对应领域的开发者编写和审核，确保内容准确可靠。如发现任何问题，欢迎向我们反馈。