CSS参考手册

文本 | Text

连字符 | hyphens

该hyphens CSS属性指定当文字跨越多行时如何自动换行断字。您可以完全禁止连字符，在文本中手动指定点来使用连字符，或者让浏览器在适当的地方自动插入连字符。

/* Keyword values */
hyphens: none;
hyphens: manual;
hyphens: auto;

/* Global values */
hyphens: inherit;
hyphens: initial;
hyphens: unset;

连字规则是依语言而定的。在HTML中，语言是由lang属性决定的，只有当这个属性存在时且有合适的连字符字典可用时，浏览器才会使用连字符。在XML中，要求必须使用xml:lang属性。

注意：定义如何执行连字符的规则没有被规范明确定义，所以确切的连字符规则可能因浏览器而异。

Initial value	manual
Applies to	all elements
Inherited	yes
Media	visual
Computed value	as specified
Animation type	discrete
Canonical order	the unique non-ambiguous order defined by the formal grammar

语法

该hyphens属性被指定为从下面的列表中选择出的单个关键字。

可能值

none——即使文字中的字符表示换行符，文字也不会在换行符处断开。行将只包含在空白处。

manual——只有在单词内部的字符表示换行的情况下，单词才会被断开。有关详细信息，请参阅下面的建建议的换行时机。

auto——只要遵循它所选择使用的任何规则，浏览器就可以自由地在合适的连字点处自动分词。但是，建议的换行时机（请参阅下面的建议换行时机）将覆盖自动断点选择。

注：该auto设置的行为取决于语言被正确标记，以便可以选择相应的断字规则。您必须使用lang这个HTML属性指定一种语言，以确保自动连字符应用于您所选择的语言。

建议换行时机

有两个Unicode字符可用于在文本中手动指定潜在的换行点：

U + 2010（HYPHEN）：该“硬”连字符表示可见的换行时机。即使该行实际上没有被断开，连字符仍然呈现。

U + 00AD（SHY）：一个不可见的“软”连字符。这个字符不是可见的，它只是标志着浏览器应该断行的位置。在HTML中，您可以使用插入一个软连字符。

形式语法

none | manual | auto

实例

这个例子使用三个类，其中一个用于hyphens属性的每个可能的配置。

HTML

<ul>
  <li><code>none</code>: no hyphen; overflow if needed
    <p lang="en" class="none">An extreme&shy;ly long English word</p>
  </li>  
  <li><code>manual</code>: hyphen only at &amp;hyphen; or &amp;shy; (if needed)
    <p lang="en" class="manual">An extreme&shy;ly long English word</p>
  </li>
  <li><code>auto</code>: hyphen where the algorithm is deciding (if needed)
    <p lang="en" class="auto">An extreme&shy;ly long English word</p>
  </li>
</ul>

CSS

p { 
  width: 55px;
  border: 1px solid black;
 }
p.none {
  -webkit-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
}
p.manual {
  -webkit-hyphens: manual;
  -ms-hyphens: manual;
  hyphens: manual;
}
p.auto {
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

结果

规范

Specification	Status	Comment
CSS Text Module Level 3The definition of 'hyphens' in that specification.	Working Draft	Initial definition

浏览器兼容性

Feature	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
Basic support	13.0-webkit1 55.0 (unprefixed)	6.0 (6.0)-moz2 43.0 (43.0)	10.0-ms3	44	5.1-webkit
Hyphenation dictionary for Afrikaans (af, af-*)	?	8.0 (8.0)	No support	?	No support
Hyphenation dictionary for Bulgarian (bg, bg-*)	?	8.0 (8.0)	No support	?	No support
Hyphenation dictionary for Catalan (ca, ca-*)	?	8.0 (8.0)	10.0	?	9.1
Hyphenation dictionary for Croatian (hr, hr-*)	?	8.0 (8.0)	No support	?	9.1
Hyphenation dictionary for Czech (cs, cs-*)	?	No support	10.0	?	9.1
Hyphenation dictionary for Danish (da, da-*)	?	8.0 (8.0)	10.0	?	9.1
Hyphenation dictionary for Dutch (nl, nl-*)	?	8.0 (8.0)	10.0	?	5.1
Hyphenation dictionary for English (en, en-*)	55.0 (unprefixed)	6.0 (6.0)4	10.0	44	5.15
Hyphenation dictionary for Esperanto (eo, eo-*)	?	8.0 (8.0)	No support	?	No support
Hyphenation dictionary for Estonian (et, et-*)	?	8.0 (8.0)	No support	?	No support
Hyphenation dictionary for Finnish (fi, fi-*)	?	8.0 (8.0)	No support	?	9.1
Hyphenation dictionary for French (fr, fr-*)	?	8.0 (8.0)	10.0	?	5.1
Hyphenation dictionary for Galician (gl, gl-*)	?	9.0	No support	?	No support
Hyphenation dictionary for German, Traditional Orthography of 1901 (de-1901, de-AT-1901, de-DE-1901)	?	8.0	?	?	?
Hyphenation dictionary for German, Reformed Orthography of 1996 (de, de-1996, de-DE, de-AT, de-*)	?	8.0	10.0	?	5.1
Hyphenation dictionary for German, Swiss Orthography (de-CH, de-CH-*)	?	8.0	?	?	?
Hyphenation dictionary for Hungarian (hu, hu-*)	?	9.0	No support	?	9.1
Hyphenation dictionary for Icelandic (is, is-*)	?	8.0	No support	?	No support
Hyphenation dictionary for Interlingua (ia, ia-*)	?	8.0	No support	?	No support
Hyphenation dictionary for Italian (it, it-*)	?	9.0	10.0	?	5.1
Hyphenation dictionary for Kurmanji (kmr, kmr-*)	?	8.0	No support	?	No support
Hyphenation dictionary for Latin (la, la-*)	(Yes)	8.0	No support	44	No support
Hyphenation dictionary for Lithuanian (lt, lt-*)	?	8.0	No support	?	No support
Hyphenation dictionary for Mongolian (mn, mn-*)	?	8.0	No support	?	No support
Hyphenation dictionary for Norwegian (Bokmål) (no, no-, nb, nb-)	?	8.0	10.0	?	9.1
Hyphenation dictionary for Norwegian (Nynorsk) (nn, nn-*)	?	8.0	10.0	?	No support
Hyphenation dictionary for Polish (pl, pl-*)	?	31.0	10.0	?	9.1
Hyphenation dictionary for Portuguese (pt, pt-*)	?	8.06	10.0	?	9.1
Hyphenation dictionary for Brazilian Portuguese (pt-BR)	?	8.06	10.0	?	No support
Hyphenation dictionary for Russian (ru, ru-*)	?	8.0	10.0	?	5.1
Hyphenation dictionary for Serbian, Bosnian, Serbo-Croatian (sh, sh-, sr, sr-, bs, bs-*)	?	8.0	No support	?	No support
Hyphenation dictionary for Slovenian (sl, sl-*)	?	8.0	No support	?	No support
Hyphenation dictionary for Spanish (es, es-*)	?	8.0	10.0	?	5.1
Hyphenation dictionary for Swedish (sv, sv-*)	?	8.0	10.0	?	9.1
Hyphenation dictionary for Turkish (tr, tr-*)	?	9.0	10.0	?	9.1
Hyphenation dictionary for Ukrainian (uk, uk-*)	?	9.0	No support	?	9.1
Hyphenation dictionary for Upper Sorbian (hsb, hsb-*)	?	8.0	No support	?	No support
Hyphenation dictionary for Welsh (cy, cy-*)	?	8.0	No support	?	No support
Hyphenation dictionary for other languages	?	No support	No support	?	No support

Feature	Android	Android Webview	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile	Chrome for Android
Basic support	4.0-webkit1	55.0 (unprefixed)	6.0 (6.0)-moz2 43.0 (43.0)	No support	44	4.2-webkit	55.0 (unprefixed)
Hyphenation dictionary for Afrikaans (af, af-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Bulgarian (bg, bg-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Catalan (ca, ca-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Croatian (hr, hr-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Czech (cs, cs-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Danish (da, da-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Dutch (nl, nl-*)	?	?	?	?	?	?	?
Hyphenation dictionary for English (en, en-*)	?	55.0 (unprefixed)	?	?	44	?	55.0 (unprefixed)
Hyphenation dictionary for Esperanto (eo, eo-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Estonian (et, et-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Finnish (fi, fi-*)	?	?	?	?	?	?	?
Hyphenation dictionary for French (fr, fr-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Galician (gl, gl-*)	?	?	?	?	?	?	?
Hyphenation dictionary for German, Traditional Orthography of 1901 (de-1901, de-AT-1901, de-DE-1901)	?	?	?	?	?	?	?
Hyphenation dictionary for German, Reformed Orthography of 1996 (de, de-1996, de-DE, de-AT, de-*)	?	?	?	?	?	?	?
Hyphenation dictionary for German, Swiss Orthography (de-CH, de-CH-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Hungarian (hu, hu-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Icelandic (is, is-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Interlingua (ia, ia-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Italian (it, it-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Kurmanji (kmr, kmr-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Latin (la, la-*)	?	(Yes)	?	?	44	?	(Yes)
Hyphenation dictionary for Lithuanian (lt, lt-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Mongolian (mn, mn-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Norwegian (Bokmål) (no, no-, nb, nb-)	?	?	?	?	?	?	?
Hyphenation dictionary for Norwegian (Nynorsk) (nn, nn-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Polish (pl, pl-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Portuguese (pt, pt-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Brazilian Portuguese (pt-BR)	?	?	?	?	?		?
Hyphenation dictionary for Russian (ru, ru-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Serbian, Bosnian, Serbo-Croatian (sh, sh-, sr, sr-, bs, bs-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Slovenian (sl, sl-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Spanish (es, es-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Swedish (sv, sv-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Turkish (tr, tr-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Ukrainian (uk, uk-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Upper Sorbian (hsb, hsb-*)	?	?	?	?	?	?	?
Hyphenation dictionary for Welsh (cy, cy-*)	?	?	?	?	?	?	?
Hyphenation dictionary for other languages	?	?	?	?	?	?	?

文本 | Text相关

1.CSS文本 \| CSS Text
2.越线 \| line-break
3.溢出包装 \| overflow-wrap
4.标签尺寸 \| tab-size
5.文本对齐 \| text-align
6.文本最终对齐 \| text-align-last
7.文本对齐 \| text-justify
8.空白 \| white-space
9.字断 \| word-break
10.自动换行 \| word-wrap

CSS

层叠样式表（ Cascading Style Sheets ）是一种用来表现 HTML 或 XML 等文件样式的计算机语言。CSS 不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。

CSS目录

1.动画和转换 \| Animations & Transitions
2.背景和边框 \| Backgrounds & Borders
3.基本框模型 \| Basic Box Model
4.基本用户界面 \| Basic User Interface
5.框对齐 \| Box Alignment
6. 级联和继承 \| Cascading & Inheritance
7.颜色 \| Color
8. 合成与混合 \| Compositing & Blending
9.条件和规则 \| Conditional Rules
10.计数器样式 \| Counter Styles
11.设备适配 \| Device Adaptation
12.扩展 \| Extensions
13.滤镜效果 \| Filter Effects
14.灵活的框布局 \| Flexible Box Layout
15.字体 \| Fonts
16.片段模块 \| Fragmentation
17.全屏 API \| Fullscreen API
18. 生成内容 \| Generated Content
19.网格布局 \| Grid Layout
20.图像值 \| Image Values
21.初始线格局 \| Inline Layout
22.列表和计数器 \| Lists & Counters
23.逻辑属性 \| Logical Properties
24.面具 \| Masking
25.媒体查询 \| Media Queries
26.杂项 \| Miscellaneous
27.Miscellaneous Level 1
28.Miscellaneous Level 2
29.运动路径 \| Motion Path
30. 多列布局 \| Multi-column Layout
31.命名空间 \| Namespaces
32.项目模型 \| Object Model View
33.网页媒体 \| Paged Media
34.定位布局 \| Positioned Layout
35.伪元素 \| Pseudo-
36.节奏大小 \| Rhythmic Sizing
37. Ruby布局 \| Ruby Layout
38.可缩放矢量图形 \| Scalable Vector Graphics
39.滚动快照 \| Scroll Snap
40.选择 \| Selectors
41.形状 \| Shapes
42.文本 \| Text
43.文字装饰 \| Text Decoration
44.变换 \| Transforms
45.值和单位 \| Values & Units
46.变量 \| Variables
47.写入模型 \| Writing Modes
48.CSS 教程
49.CSS 创建
50.CSS Id 和 Class选择器
51.CSS 简介
52.CSS 盒子模型
53.CSS Table(表格)
54.CSS 列表样式(ul)
55.CSS 链接(link)
56.CSS Fonts(字体)
57.CSS Text(文本)
58.CSS Backgrounds(背景)
59.CSS Display(显示) 与 Visibility（可见性）
60.CSS 尺寸 (Dimension)
61.CSS 分组和嵌套
62.CSS 轮廓（outline）属性
63.CSS Border(边框)
64.CSS 图像透明/不透明
65.CSS 导航栏
66.CSS 伪元素
67.CSS 伪类
68.CSS Float（浮动）
69.CSS Position(定位)
70.CSS 总结
71.CSS 属性选择器
72.CSS 媒体类型
73.CSS 图像拼合技术
74.CSS 实例
75.CSS 组合选择符
76.响应式 Web 设计 – 框架
77.响应式 Web 设计 – 视频(Video)
78.CSS 提示工具(Tooltip)
79.CSS 布局 Overflow
80.CSS 计数器
81.CSS 表单