font-weight字体重量和font-family字体类型中的粗细度的对应关系

 

 

一.font-family: 

Google Fonts : 

https://fonts.google.com/

例如Barlow 字体：

 

 

 注意： 

1.  每个字体粗细类型都有 Italic 相对应，即为对应的斜体字

2. // 字体粗细类型(从细到粗)
   Thin
   ExtraLight
   Light
   Regular
   Medium
   SemiBold
   Bold
   ExtraBold
   Black

    

二. font-weight:

名称： font-weight

取值： normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900

初始： normal

其中数值和文本取值的对应关系：

• 400： normal

• 700：bold

• bolder：指定外观的重量大于继承的值

• lighter：指定外观的重量小于继承的值

 

// 100 - 900 的数值和 font-family字体粗细类型的对应关系

100 - Thin

200 - Extra Light (Ultra Light)

300 - Light

400 - Regular (Normal、Book、Roman)

500 - Medium

600 - Semi Bold (Demi Bold)

700 - Bold

800 - Extra Bold (Ultra Bold)

900 - Black (Heavy)

 

 

 

前端页面的规范化显示

1. 统一使用弹窗，气泡提示

2. 统一使用颜色，背景色，标题栏背景色， 文字颜色，主题色

3. 统一使用请求接口的反馈（包括请求状态LOADING，失败状态：ERROR，正常状态：NORMAL），失败状态需要统一使用占位显示，请求状态需要统一使用缓冲状态

4. 请求方法必须使用统一的封装，最好放到统一的页面上，方便修改，最终通过统一的返回状态来实现请求的全状态控制 fetch

5. 涉及到编号的，必须使用枚举，比如postMessage的code编号

6. 涉及到常量的，必须提取到独立页面进行配置 Constant，例如上面的LOADING、ERROR、NORMAL

7. 语言状态的封装，i18n，需要记录当前的语言模式en/zh-hant/zh-hans

8. 尽量使用统一的封装，例如CommonView，CommonStyle，CommonUtil，Images，Icons

9. 注意项目的目录配置 page，container，presentation，component，general(icons，images， fonts，languages，pdf，ui，util，fetch，)

10. 统一Storage的使用

11. 统一Layout的使用