排版
连字符
控制单词如何分割的工具性类名。
| Class | Styles |
|---|---|
hyphens-none | hyphens: none; |
hyphens-manual | hyphens: manual; |
hyphens-auto | hyphens: auto; |
示例
防止分割
使用 hyphens-none 工具类可以防止单词被分割，即便使用了换行建议 ­：
官方认定为德语中最长的单词， Kraftfahrzeughaftpflichtversicherung 是一个36个字母的关于机动车责任保险的术语。
<p class="hyphens-none"> ... Kraftfahrzeug­haftpflichtversicherung 是一个 ...</p>手动分割
使用 hyphens-manual 工具类仅在使用换行建议 ­ 的地方设置分割点：
官方认定为德语中最长的单词， Kraftfahrzeughaftpflichtversicherung 是一个36个字母的关于机动车责任保险的术语。
<p class="hyphens-manual"> ... Kraftfahrzeug­haftpflichtversicherung 是一个 ...</p>这是浏览器的默认行为。
自动分割
使用 hyphens-auto 工具类允许浏览器根据语言自动选择分割点：
官方认定为德语中最长的单词， Kraftfahrzeughaftpflichtversicherung 是一个36个字母的关于机动车责任保险的术语。
<p class="hyphens-auto" lang="de"> ... Kraftfahrzeughaftpflichtversicherung 是一个 ...</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 ..."> Lorem ipsum dolor sit amet...</p>Learn more about using variants in the variants documentation.
