css之样式惨案-字体族学习

项目场景：

UE同学反馈 字体未加粗、文字之间分割线没有与文字居中对齐。

定位到了问题后，我发现字体确实已经加粗，而且设置的flex布局通过align-items设置了垂直居中。在安卓上，字体加粗了，而iphone上字体未加粗。所以我认为这又是一个难搞的兼容问题…

尝试了各种方案发现就是没效果

1. 然后发现加粗问题是字体族写错了…

font-family: PingFangSC-Medium;
// 而我拼成了
// font-family: PingFangSC-Meduium;
// 就离谱....

done!

font-family: PingFang SC
// 错误写法
// font-family: PingFangSC

总结

发现bug的解决思路（1）bug处是否有文字拼写错误（2）再查看逻辑问题（后续有沉淀再更新叭）
有时间学习下字体组族相关 ----- 前端必备…