mirror of
https://github.com/ElemeFE/element.git
synced 2025-12-19 12:04:02 +08:00
3.2 KiB
3.2 KiB
<style>
.demo-typo-box {
height: 200px;
width: 200px;
position: relative;
border: 1px solid #eaeefb;
font-size: 40px;
color: #1f2d3d;
text-align: center;
line-height: 162px;
padding-bottom: 36px;
box-sizing: border-box;
display: inline-block;
margin-right: 17px;
border-radius: 4px;
.name {
position: absolute;
bottom: 0;
width: 100%;
height: 35px;
border-top: 1px solid #eaeefb;
font-size: 14px;
color: #8492a6;
line-height: 35px;
text-align: left;
text-indent: 10px;
font-family: 'Helvetica Neue';
}
}
.demo-typo-size {
.h1 {
font-size: 20px;
}
.h2 {
font-size: 18px;
}
.h3 {
font-size: 16px;
}
.text-regular {
font-size: 14px;
}
.text-small {
font-size: 13px;
}
.text-smaller {
font-size: 12px;
}
.color-dark-light {
color: #99a9bf;
}
}
.typo-PingFang {
font-family: 'PingFang SC';
}
.typo-Hiragino {
font-family: 'Hiragino Sans GB';
}
.typo-Microsoft {
font-family: 'Microsoft YaHei';
}
/* 英文 */
.typo-Helvetica-Neue {
font-family: 'Helvetica Neue';
}
.typo-Helvetica {
font-family: 'Helvetica';
}
.typo-Arial {
font-family: 'Arial';
}
</style>
Typography
We create a font convention to ensure the best presentation across different platforms.
Chinese Font
和畅惠风
PingFang SC
和畅惠风
Hiragino Sans GB
和畅惠风
Microsoft YaHei
English / Numberic Font
RGag
Helvetica Neue
RGag
Helvetica
RGag
Arial
Font-family
font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
Font Convention
| Main Title | Build with Element | 20px Extra large |
| Title | Build with Element | 18px large |
| Small Title | Build with Element | 16px Medium |
| Body | Build with Element | 14px Small |
| Body (small) | Build with Element | 13px Extra Small |
| Supplementary text | Build with Element | 12px Extra Extra Small |