基础字体属性
1. color: 文本颜色。
2. font-size: 字号,应影响测量和绘制。
3. font-family: 字体族。
4. font-weight: 字重,700 应明显更粗。
5. font-style: oblique 斜体。
6. line-height: 行高,应影响多行间距。
7. text-stroke: 描边颜色和宽度。
新增文本属性
1. direction: ltr / rtl,影响逻辑方向。
2. letter-spacing: 字符间距。
3. text-align: left / center / right / start / end。
4. vertical-align: top / middle / bottom。
5. text-indent: 首行缩进。
6. white-space: normal / nowrap / pre / pre-line / pre-wrap。
预期检查重点
1. 文本宽度计算应与绘制一致(含 letter-spacing)。
2. 对齐应在容器内正确定位,不应被 padding/border 干扰。
3. white-space 对空格和换行处理应可见差异。
4. direction=rtl 时 start/end 与缩进方向应变化。
A. 基础字体属性组合
预期: 第二行更大更粗更斜,且描边可见,行距明显拉开。
Normal 11px / line-height 1.0
Large Bold Oblique Stroke
B. letter-spacing 对比
预期: same text 从 normal 到 4px 字距逐渐变宽。
LETTER SPACING SAMPLE
LETTER SPACING SAMPLE
LETTER SPACING SAMPLE
C. text-align 对比
预期: 文本分别靠左/居中/靠右。
text-align: left
text-align: center
text-align: right
D. vertical-align 对比
预期: 同高度容器内文本显示在顶部/中部/底部。
vertical-align: top
vertical-align: middle
vertical-align: bottom
E. text-indent 首行缩进
预期: 仅首行缩进,后续行不缩进。
Indent test fallback text A B C
Indent test fallback text A B C
Indent test fallback text A B C
F. white-space 对比
预期: normal 折叠空白; nowrap 不换行; pre 保留空格和换行; pre-line 折叠空格保留换行; pre-wrap 同时保留并可换行。
G. direction + text-align:start/end
预期: ltr-start 靠左、ltr-end 靠右;rtl-start 靠右、rtl-end 靠左。
LTR start | ABC 123
LTR end | ABC 123
RTL start | ABC 123
RTL end | ABC 123