未分类 2010/04/11 给我留言 0次查看

分页： 1 2 3 4

最终效果预览

详细教程
软件：Adobe Photoshop
版本：CS4
难度：中级
预计完成时间：大约两个小时 

步骤1

 为了确保能够对齐我们采用960s坐标制（从这里获取）下载打开文件
我们先创建背景图层，在背景层上右击，然后选择背景图层，命名为“bg”。 

步骤2 

我们运用了这么多参考线，所以我们需要打开视图>标尺。  

步骤3

我们要为标题区设置下边框，所以需要在下方100px拖拽一条新的参考线，执行视图——新建参考线，位置：100  

步骤 4

让我们来创建标题。先创建一个1020*100px的选区，然后按下shift+backspace 填充（可用任何颜色）

将这个图层命名为“header-bg”。

步骤 5

输入网站标题，并设置以下文字属性：
字体设置： Rockwell (从这里获取)
字体大小: 30px
字体样式: Regular
反锯齿设置：平滑
颜色：不要紧，因为我们还要执行一个渐变叠加

现在对文本添加渐变叠加，参考下图所示：

将你的网站标题和标题背景色对齐；同时选择你的标题层和“header-bg”层，然后选择垂直居中。

步骤 6

导航条字符设置如下：
字体设置：Arial
字体大小: 20px
字体样式: Regular
反锯齿设置：平滑
颜色：#ffffff

创建一个圆角矩形作为一个动态链接，固定大小65*35Px，半径5px，（可用任何颜色填充）。  

根据下图所示：执行描边，渐变叠加.  

在我们进行下一步之前，首先要确保你的图层条理清晰，下面展示的是我们的图层面版!

步骤7

现在我们该创建一个特色的设计空间了。我们先在上一个参考线430px之后添加一个水平的参考线作为下边框。  

创建一个1020*430px的选区作为特色设计空间的背景，用任何颜色填充。  

然后执行图层样式——渐变叠加，设置参考下图所示：

现在让我们添加光泽效果！创建一个1020*120px的选区，用任何颜色填充。

然后添加渐变叠加，可参考下图设置。

降低图层不透明度到40%

步骤 8

接下来添加高光！运用单排选取框工具创建一个1像素的选区，如下图所示设置对齐：

设置前景色为 #acd86e 然后按下 shift+backspace 填充；要确定是使用前景色作为填充色。

我保证你会拥有一个很棒的像素细节。

我们已经做好了创建背景的基础，所以我们要给他们命名，使他们系统化，然后把他们组合在一起。

步骤 9

让我们更精确些！根据下图拖拽两条参考线。

输入欢迎语，字符设置如下：

 

页面： 1 2 3 4