第二十步：创建搜索框

新建组，命名为“搜索”，放置在“导航”组上面。选取圆角矩形工具(U)，设置半径3px，前景色为#104f59，创建圆角矩形，命名新的图层为“文本区域”，透明度为80%。

选取矩形工具，在“文本区域”右边创建一矩形，并如下图进行设置图层样式“渐变叠加”，然后右击图层，在下拉菜单中选择“创建快速蒙版”，层命名为“按钮”。

选取字体工具(T)，使用白色，在“按钮”上书写“搜索”两字，图层透明度为75%。

选取线条工具(U)，使用颜色#123036创建直线，图层命名为“直线”，并放置在“按钮”图层下方，把此直线移动在搜索框和按钮之间。

第二十一步：新建蓝色矩形

在组“导航”下新建组(图层>新建>组)，组命名为“案例”，再新建组放置在“案例”中，并命名为“背景”

选取矩形工具(U)，颜色设置为#219aad，创建宽度为983px，高度为273px的蓝色矩形，(提示：打开(按F8)信息面板，查看宽度和高度)，设置此图层的透明度为55%，命名为“bg4”

3.　在photoshop中打开在上篇中一开始要保存的第二张图片“像素化的蓝色矩形”，把图片移动到此文档中，并且覆盖蓝色矩形，同样也设置透明度为55%，命名为“bg3”。

4.　按住ctrl键，点击“bg4”中的矢量蒙版缩略图以选中此蒙版

5.　新建图层，放在“bg3”上方，命名为“bg2”，选取渐变工具(G)，画一个颜色#56b8e5到透明的渐变，方向是从选区底部到选区头部，然后按ctrl+d撤消选区

6、新建图层，放在图层“bg2”上方，命名为“bg1”，选取矩形选框工具(M)，像下图一样创建选区，宽度为983px，高度43px

7、选取渐变工具(G)，画一个颜色#0f2b42到颜色#2a607f的渐变，方向是从选区底部到选区头部，然后按ctrl+d撤消选区

第二十二步：“注册”与“了解更多

1.新建组“注册按钮”，放在组“背景”上方，选取圆角矩形工具(U)，设置半径2px，像下图一样新建圆角矩形(82*38)，并设置如下图一样的图层样式(注意：shap2图层的透明度是100%)

2. 重复步驟1创建“了解更多”的按鈕，并且增加一层，添加箭头，选取自定义形状工具(U)中的第二个箭头形状，像下图一样创建箭头