Typography
hyphens
控制单词如何断字的功能类。
| Class | Styles |
|---|---|
hyphens-none | hyphens: none; |
hyphens-manual | hyphens: manual; |
hyphens-auto | hyphens: auto; |
示例
防止断字
使用 hyphens-none 功能类可以防止单词断字，即使使用了断行建议符 ­：
Officially recognized by the Duden dictionary as the longest word in German, Kraftfahrzeughaftpflichtversicherung is a 36 letter word for motor vehicle liability insurance.
<p class="hyphens-none"> ... Kraftfahrzeug­haftpflichtversicherung is a ...</p>手动断字
使用 hyphens-manual 功能类只在使用断行建议符 ­ 的地方设置断字点：
Officially recognized by the Duden dictionary as the longest word in German, Kraftfahrzeughaftpflichtversicherung is a 36 letter word for motor vehicle liability insurance.
<p class="hyphens-manual"> ... Kraftfahrzeug­haftpflichtversicherung is a ...</p>这是浏览器的默认行为。
自动断字
使用 hyphens-auto 功能类允许浏览器根据语言自动选择断字点：
Officially recognized by the Duden dictionary as the longest word in German, Kraftfahrzeughaftpflichtversicherung is a 36 letter word for motor vehicle liability insurance.
<p class="hyphens-auto" lang="de"> ... Kraftfahrzeughaftpflichtversicherung is a ...</p>断行建议符 ­ 的优先级将高于自动断字点。
响应式设计
Prefix a hyphens utility with a breakpoint variant like md: to only apply the utility at medium screen sizes and above:
<p class="hyphens-none md:hyphens-auto ..."> <!-- ... --></p>Learn more about using variants in the variants documentation.
