首页理论教育登录表单制作：零响应与投影样式详解

登录表单制作：零响应与投影样式详解

2025-09-29 理论教育版权反馈

【摘要】：前者指输入为零时的响应,后者指动态元件初始储能为零时的响应。23图526 添加“投影”图层样式24 单击“确定”按钮完成登录表单的制作，如图527所示。

登录表单包括少量的信息输入，例如用户名、密码、操作按钮、密码帮助、注册选项等，很多应用还会添加用户头像。下面介绍登录表单的设计制作，图5‑2所示为制作流程图。

图5‑2 登录表单制作流程图

01 按Ctrl+O组合键打开一张素材图片，如图5‑3所示。

图5‑3 打开素材

02 设置前景色为白色，使用“矩形工具”绘制矩形，如图5‑4所示。

图5‑4 绘制矩形

03 为图层添加“渐变叠加”和“投影”样式，如图5‑5所示。

图5‑5 添加图层样式

04 再次使用“矩形工具”绘制矩形如图5‑6所示。

图5‑6 绘制矩形

05 使用“横排文字工具”输入文字，并修改“立即注册”的颜色为蓝色，如图5‑7所示。

图5‑7 输入文字

06 使用“矩形工具”绘制矩形，如图5‑8所示。

图5‑8 绘制矩形

07 复制图层，将矩形缩小2px，如图5‑9所示。

图5‑9 复制并缩小

08 打开素材图片，并拖入文档中，如图5‑10所示。

图5‑10 打开素材

09 为图层添加蒙版，然后单击蒙版，填充黑色。按住Ctrl键单击下层矩形的缩览图，载入选区，然后执行“选择”|“变换选区”命令，将其缩小到102px，如图5‑11所示。

图5‑11 缩小选区

10 填充白色，效果如图5‑12所示。

图5‑12 效果

11 使用“矩形工具”绘制矩形，如图5‑13所示。

图5‑13 绘制矩形

12 为图层添加“描边”样式，如图5‑14所示。

图5‑14 添加“描边”样式(https://www.chuimin.cn)

13 单击“确定”按钮关闭对话框，添加后的效果如图5‑15所示。

图5‑15 添加后的效果

14 使用绘图工具绘制图形，如图5‑16所示。

图5‑16 绘制图形

15 继续绘制图形，如图5‑17所示。

图5‑17 继续绘制图形

16 复制矩形框图层，为图层添加“描边”和“外发光”样式，如图5‑18所示。然后绘制图形，效果如图5‑19所示。16

图5‑18 添加图层样式

图5‑19 绘制图形

17 使用“横排文字工具”输入文字，如图5‑20所示。

图5‑20 输入文字

18 在下方绘制圆角矩形并添加图层样式，然后输入文字，如图5‑21所示。

图5‑21 绘制图形并输入文字

19 使用“圆角矩形工具”绘制圆角矩形，如图5‑22所示。

图5‑22 绘制圆角矩形

20 为图层添加“描边”“内阴影”和“渐变叠加”样式，如图5‑23所示。

图5‑23 添加图层样式

21 执行确定操作后的图像如图5‑24所示。

图5‑24 图像效果

22 使用“横排文字工具”输入文字，如图5‑25所示。

图5‑25 输入文字

23 为文字添加“投影”图层样式，如图5‑26所示。单的制作，如图5‑27所示。23

图5‑26 添加“投影”图层样式

24 单击“确定”按钮完成登录表单的制作，如图5‑27所示。

图5‑27 完成制作