Skip to main content Link Search Menu Expand Document (external link)

排版工具

目录

  1. 字体型号
  2. 字体粗细
  3. 行高
  4. 文本调整

字体型号

使用 .fs-1 - .fs-10 精准设置字体型号。

小屏幕型号 font-size大屏幕型号 font-size
.fs-19px10px
.fs-211px12px
.fs-312px14px
.fs-414px16px
.fs-516px18px
.fs-618px24px
.fs-724px32px
.fs-832px38px
.fs-938px42px
.fs-1042px48px

Font size 1

Font size 2

Font size 3

Font size 4

Font size 5

Font size 6

Font size 7

Font size 8

Font size 9

Font size 10

在 Markdown 中,用 `{: }` 封装应用定制类:

Font size 1
{: .fs-1 }
Font size 2
{: .fs-2 }
Font size 3
{: .fs-3 }
Font size 4
{: .fs-4 }
Font size 5
{: .fs-5 }
Font size 6
{: .fs-6 }
Font size 7
{: .fs-7 }
Font size 8
{: .fs-8 }
Font size 9
{: .fs-9 }
Font size 10
{: .fs-10 }

字体粗细

.fw-300 - .fw-700 精准设置字体型号。

Font weight 300

Font weight 400

Font weight 500

Font weight 700

在 Markdown 中,用 `{: }` 封装应用定制类:

Font weight 300
{: .fw-300 }
Font weight 400
{: .fw-400 }
Font weight 500
{: .fw-500 }
Font weight 700
{: .fw-700 }

行高

使用 lh- 类精准设定文字的行高。

line-height注释
.lh-00 
.lh-tight1.1标题默认值
.lh-default1.4正文默认值(段落)

No Line height No Line height

Tight line height Tight line height

Default line height Default line height

在 Markdown 中,用 `{: }` 封装应用定制类:

No Line height
No Line height
{: .lh-0 }

Tight line height
Tight line height
{: .lh-tight }

Default line height
Default line height
{: .fh-default }

文本调整

默认文本会左对齐。使用这些 text- 类覆盖默认设置:

ClassWhat it does
.text-lefttext-align: left
.text-righttext-align: right
.text-centertext-align: center