用户登录

按一下 r ,打开矩形工具,在画板的顶部画一个这样的长条矩形,这个地方可以作为页面的头部,在这个区域里面可以放一些工具,比如搜索栏,下拉菜单,还可以放一些工具按钮之类的东西。

去掉边框,修改一下填充颜色,手工输入一个颜色值,f4fa9c 。 然后手工再修改一下这个矩形的高度,设置成 96 。

双击这个矩形图层,名字改成 container, command + g,把它放在一个群组里,群组的名字改成 page__header 。

然后在这个头部区域的右侧这里可以再画两个矩形,用它们表示在这个区域里的工具按钮。 去掉边框,再修改一下填充颜色。手工输入颜色值。

常用的颜色可以把它添加到这个拾色器里面。修改一下这个矩形的宽度,大小是 24,高度也是 24。

command + 引号,打开方形网格,按住 alt 键,拖动这个矩形,复制一份。 两个矩形之间的间隔可以是 24 。

然后修改一下它们的名字,改成 toolbar__item , 同时选中这两个图层,command + g,把它们放在一个群组里,群组的名字设置成 toolbar ,拖动这个群组,把它放在 page__header 这个群组里。

最后再预览一下这个 page__header 。

页面布局(XD):页头《 从设计到代码:布局设计 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点