css排版

1. 行内盒子高度（line-height）=上下两个半铅空+内容区高度（font-size）

so, if line-height为30px, font-size为22px, 则半铅空为4px.

2. line-height单位可以是em, px, %, 或是number（倍数）。

• number: 此数字会与当前font-size相乘来设置行间距（推荐使用）
• %：相对于font-size来计算的
• px / em：em跟数字一样，都是相对于font-size来计算的

line-height继承值：

• 若设置的是px或%，则继承的是计算后的像素值;
• 若设置的是倍数，则子元素继承的只是系数1.5，而非计算后的像素值。「eg: line-height: 1.5，若font-size使用默认值16px，则line-height实际为24px。」

3. 除line-height外，vertical-align也会影响行间距。

vertical-align取值:base-line(默认值), super, sub, top, bottom, middle, text-top, text-bottom

4.  字体粗细: font-weight: normal, bold, bolder, lighter, 或100的整数倍。

　字体倾斜 font-style: normal(默认值), italic

5. 大小写转换：text-transform: none(默认值), uppercase, lowercase, capitalize(首字母)，full-width

6. 文本超出： text-overflow: clip(默认值，截断文本), ellipsis（用一个省略号"..."表示截断文本）, 给定某个字符串<string>（如"[..]"）

6. 元素中的空白：white-space: normal(合并连续的空白符，换行符会被当作空白符，必要时换行), nowrap(同前，不换行，直到遇到<br>才会换行), pre（保留连续的空白符，遇到换行符或<br>时换行）, pre-wrap（保留空白，正常地进行换行）, pre-line（合并空白符，但是保留换行符）

7. 单词断行：word-break: normal, break-all, keep-all, break-word

8. 单词或标签间距: word-spacing: normal, 长度（20px, 3em...), percentage

 .bar:: after {

content: ' \D7';    // 样式显示为x

display: block;

}