每人每天仅限5票，快给你心仪的作品鼓励的一票。
投票
0.0°
因为我们的项目用到了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的场景色方式，不同场景采用不同场景色，一些主题性的地方可以采用主色调。
全部评论：38条
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
夏了个夏天啊
2016-06-23 17:59Hi，我是猎头Rachel，看到你的作品非常欣赏。有一个互联网智能硬件公司的设计职位想给你推荐一下，他们成立于美国硅谷，智能硬件由德国团队设计，软件APP由上海的设计团队负责。他们的产品针对海外中高端市场，在国外有很好的销量。设计工作会涉及到和美国的同事协作。不知道是否感兴趣，可以私信留手机号码沟通一下吗？
-
-
-
见习Cc
2016-04-04 11:11想必阁下是没写过Bootstrap吧，Bootstrap.min.css里body的定义 { font-size: 14px; line-height: 1.42857143; } 算起来正好20，所谓追求完美布局更恰当的说是 “基于20px的网页垂直格栅基准”http://www.zhangxinxu.com/wordpress/2016/03/css-layout-base-20px/。14*1.5=21，那么请问您奇数字号在不同浏览器显示不一致的呢，有些会向下取整的呢？ 还有修改栅格系统的大屏幕显示器 (≥1200px)的有效内容1170为1160势必要重新编译Bootstrap.css文件，就得重新设计一套新的数值，而作者所说1140-1160px是基于何种根据的呢？要知道网页栅格化的意义在于精准到每一像素，使得网页跟设计稿一致！ 这是基于Bootstrap的么?有看过Bootstrap源码么？宽度都是基于百分比的，几乎很少设置定值，请问你所给的图片和面板定值在移动端显示如何？用Bootstrap的情景色居然不知道有渐变色的！ 别误导新人了好吧!
-
-
-
-
-
-
-
-
-
-
-
- 更多
更多作品
发表评论