不建议超过6级,嵌套太多显得混乱,如果必须多级,可以使用HTML配合css模拟实现,比如:
html
<div class="h1">demo1</div>
**这是正文** 这是正文
<div class="h2">demo2</div>
**这是正文2** 这是正文2
css
.h1 {
--font-weight: var(--h1-weight);
font-variant: var(--h1-variant);
letter-spacing: -0.015em;
line-height: var(--h1-line-height);
font-size: var(--h1-size);
color: var(--h1-color);
font-weight: var(--font-weight);
font-style: var(--h1-style);
font-family: var(--h1-font);
}
.h2 {
--font-weight: var(--h2-weight);
font-variant: var(--h2-variant);
letter-spacing: -0.015em;
line-height: var(--h2-line-height);
font-size: var(--h2-size);
color: var(--h2-color);
font-weight: var(--font-weight);
font-style: var(--h2-style);
font-family: var(--h2-font);
}
效果
