第9章 行内IFC模型

有文本的地方就有IFC模型。

IFC模型设置文本的排版。IFC模型包括3个子模型:行盒line box、边界bounds、支柱strut。IFC模型包括4个属性:字体3属性(字体名称font-family、字体大小font-size、行高line-height)与垂直对齐vertical-align。

IFC模型完整示意图

img

本章主要内容:行盒line box、bounds模型、字体名称、垂直对齐、strut、行盒高度计算、原子行内级盒子、最佳实践。


补充说明:

(1)本章多处进行IFC相关高度的精确计算,用于理解原理。实际项目无需严格计算。

(2)本章使用较多盒子类别术语,回顾请见“7.7 盒子类别术语”。

(3)本章使用较多英文术语,避免中文表达与理解的歧义,中文作相应辅助说明,有时混用中文与英文。

(4)本章大量使用Arail字体以及英文字符进行测试说明,因为主流操作系统默认安装它,确保同学们调试到相同结果。如果使用其它字体或中文字符,因为可能操作系统不一致而没有默认安装该字体,导致没有真正运用设置字体。实际项目根据需要设置字体。


9.1 IFC定义

9.2 行盒line box

9.3 bounds模型

9.4 字体名称

9.5 垂直对齐

9.6 strut元素与IFC完整示意图

9.7 行盒的高度计算

9.8 盒子模型与bounds模型的关系

9.9 原子行内级盒子

9.10 IFC模型最佳实践

9.11 本章小结

9.12 课后练习