Typography

1page = canvas(size=(160 mm, 100 mm), background="#f7f9fc")2 3header = text(size=(148 mm, auto),4  spans=[5    span("文字排版", font_family="Noto Sans CJK SC", color="#203864", font_size=18 pt),6    span("  /  Typography", font_family="DejaVu Sans", color="#526f96", font_size=12 pt)7  ],8  font_size=12 pt)9page.add(header, target=page.top_left, offset=(7 mm, 6 mm))10 11rule = rect(size=(146 mm, 0.4 mm), fill="#cfdae8")12page.add(rule, target=page.top_left, offset=(7 mm, 20 mm))13 14intro = text(size=(66 mm, auto),15  spans=[16    span("同一段文字可以", font_family="Noto Sans CJK SC"),17    span("混用字体、字号和颜色", font_family="Noto Sans CJK SC", color="#d94b55"),18    span("，并按放置实例的宽度自动换行。", font_family="Noto Sans CJK SC")19  ],20  font_size=10 pt, line_height=5.8 mm)21page.add(intro, target=page.top_left, offset=(8 mm, 27 mm))22 23math_line = text(size=(66 mm, auto),24  spans=[25    span("行内公式：", font_family="Noto Sans CJK SC"),26    formula(source=r"\frac{a+b}{\sqrt{x}}", font_size=11 pt),27    span(" 与文字共用基线。", font_family="Noto Sans CJK SC")28  ],29  font_size=10 pt, line_height=6.2 mm)30page.add(math_line, target=page.top_left, offset=(8 mm, 55 mm))31 32panel = rect(size=(65 mm, 60 mm), fill="#ffffff", border_color="#d8e0ed", border_width=0.3 mm, border_radius=2 mm)33page.add(panel, target=page.top_left, offset=(86 mm, 27 mm))34 35panel_title = text(spans=[span("独立公式 / ", font_family="Noto Sans CJK SC"), span("Display equation", font_family="DejaVu Sans")], font_size=9 pt, color="#526f96")36page.add(panel_title, target=page.top_left, offset=(91 mm, 32 mm))37 38equation = formula(source=r"\int_0^1 x^2\,dx = \frac{1}{3}", font_size=18 pt, style=display)39page.add(equation, anchor=center, target=page.top_left, offset=(118 mm, 62 mm))40 41footer = text(content="MathJax vector math · reusable text materials · SVG / PDF / PNG", font_family="DejaVu Sans", font_size=7 pt, color="#7186a3")42page.add(footer, target=page.top_left, offset=(8 mm, 92 mm))