Please check Type Setting
| Type | Spec | Demo | Structure |
|---|---|---|---|
| d1 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "d1",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| d2 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "d2",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| h1 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "h1",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| h2 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "h2",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| h2-alt | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "h2-alt",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| h3 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "h3",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| h3-alt | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "h3-alt",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| h4 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "h4",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| h4-alt | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "h4-alt",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| h5 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "h5",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| p1 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "p1",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| p2 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "p2",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| p3 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "p3",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| p4 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "p4",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| p5 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "p5",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| p5-alt | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "p5-alt",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| p6 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "p6",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| p7 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "p7",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| p8 | font-size: line-height: | 借助美妙的光线传递那些动人的瞬间。 | {
"type": "p8",
"value": "借助美妙的光线传递那些动人的瞬间。"
} |
| Config | Demo |
|---|---|
{
"type": "button",
"size": "large",
"variant": "cta",
"label": "Button"
} | |
{
"type": "button",
"size": "large",
"variant": "cta",
"label": "Button",
"className": "active"
} | |
{
"type": "button",
"size": "large",
"variant": "cta",
"disabled": true,
"label": "Button"
} | |
{
"type": "button",
"size": "large",
"variant": "primary",
"label": "Button"
} | |
{
"type": "button",
"size": "large",
"variant": "primary",
"label": "Button",
"disabled": true
} | |
{
"type": "button",
"size": "large",
"variant": "secondary",
"label": "Button"
} | |
{
"type": "button",
"size": "large",
"variant": "secondary",
"label": "Button",
"disabled": true
} | |
{
"type": "button",
"size": "large",
"variant": "cta",
"icon": "iconKey from SVG component",
"label": "Button"
} | |
{
"type": "button",
"size": "large",
"variant": "cta",
"icon": "iconKey from SVG component",
"label": "Button"
} | |
{
"type": "button",
"size": "medium",
"variant": "cta",
"icon": "iconKey from SVG component",
"label": "Button"
} | |
{
"type": "button",
"size": "small",
"variant": "cta",
"icon": "iconKey from SVG component",
"label": "Button"
} | |
{
"type": "button",
"size": "medium",
"variant": "cta",
"label": "Button"
} | |
{
"type": "button",
"size": "small",
"variant": "cta",
"label": "Button"
} | |
{
"type": "button",
"size": "large",
"variant": "cta",
"icon": "iconKey from SVG component"
} | |
{
"type": "button",
"size": "medium",
"variant": "cta",
"icon": "iconKey from SVG component"
} | |
{
"type": "button",
"size": "small",
"variant": "cta",
"icon": "iconKey from SVG component"
} | |
{
"type": "button",
"size": "large",
"variant": "primary",
"label": "Button",
"flexible": true
} | |
{
"type": "button",
"size": "large",
"variant": "cta",
"label": "Inner Link",
"href": "/",
"icon": "iconKey from SVG component"
} | Inner Link |
{
"type": "button",
"size": "large",
"variant": "cta",
"label": "Outer Link",
"href": "https://www.nio.cn/es8"
} | Outer Link |
{
"type": "button",
"size": "large",
"variant": "text",
"label": "Outer Link",
"href": "https://www.nio.cn/es8"
} | Outer Link |
{
"type": "button",
"size": "large",
"variant": "text",
"label": "Outer Link",
"href": "https://www.nio.cn/es8"
} | Outer Link |
