EduSoho UI 设计规范（Web版）

因为我们的项目用到了Bootstrap前端框架，所以设计规范的一些元素是按照Bootstrap来的，另外我们也在一定程度上参考了Material Design以及Ant Design的一些东西，最后结合我们自身产品的特色和涉及到的UI元素总结出了下面这套设计规范。

在这套规范中需要注意几个问题，尤其是在Web Design中会遇到：

1、字体高度

字体是设计中非常重要的元素之一，很多设计师追求所谓的Perfect Pixel，如果要追求这个，你就必须要对字体有基本的了解，其中就包括字体高度，在Web Design中字体高度称为行高（line-height）。例如14px大小的字体，其实在行高设置为1.5的Web中高度为21px。

2、栅格布局

栅格布局是Bootstrap里面的重要概念，而且因为牵涉到响应式，所以设计师必须要对栅格的计算方式了如指掌，我们将Bootstrap的1170px container改成了1160px，所以栅格大小也做了相应调整，尤其需要了解1160px和1140px之间的关系。

3、场景色使用

因为我们产品的特殊性（需要考虑到大量定制和主题），所以色板还是沿用了Bootstrap的场景色方式，不同场景采用不同场景色，一些主题性的地方可以采用主色调。