ps 制作网页首页11 - 网页设计.docx

边。69群组所有关于丝带的图层，命名该群组为”ribbon

边。69群组所有关于丝带的图层，命名该群组为”ribbon“.70在图层”ribbonbackgro

。22选择渐变工具(G),从画布底部到顶端，拖拽一个黑色到透明的渐变。23设置图层渲染模式为叠加，设

开图层属性面板。按照下面的截图进行参数设置。-39--40-68重复以上步骤，不过这一次是在丝带的右

智能对象。27然后点击编辑自由变化(Ctrl+T),根据下图进行变形。-13--14-28点击滤镜

最终效果图

看一看我们最终的效果图吧，看上去还不错:

在photoshop中新建文档

-1-

剪辑蒙板（clippingmask）这个概念。右键点击图层“navigationbar

剪辑蒙板（clippingmask）这个概念。右键点击图层“navigationbar”layer,

。命名该图层为“ribbonbackground“.-33-60选择圆角矩形(U),设置半径为10p

的矩形的上面，在图层面板上单击创建图层剪切蒙版。命名这个图层为“image“.-26-50选择文字工

一个高为60px的矩形，命名该图层为“navigationbar“.Note:打开信息面板(F8),

1在photoshop中新建一个文档，尺寸为980px×830px.

2如果你在photoshop软件界面中，没有看到在画布的周围看到标尺，点击试图标尺（Ctrl+R）可以显示标尺。

3在画布的四个边，分别拖拽四条标尺线。在这四条线中间，我们将绘制我们的页面。

创建页面背景

-2-

。56群组所有的文字和图标图层，命名太群组为”button1

。56群组所有的文字和图标图层，命名太群组为”button1“.57创建另一个按钮。-31-58为了

置图层透明度为40%。-11-设置主要内容的背景24双击“bg”图层，打开图层属性面板。根据下图进行

T)添加一些文字。设置颜色为#EAEAB7.55你也可以添加一些小图标。如果你喜欢，可以去这里翻翻看

特“色项目”部分，自定义一个图案39好了，我们要创建一个图案。新建一个文档，文件新建(Ctrl+N

4选择圆角矩形工具(U),设置圆角半径为10px，设置颜色为#E0E0AC,在你的整个画布中拖拽一个圆角矩形。设置这个图层名字为“bg“.

5好了，现在，我们将扩大我们的画布。首先，缩小我们的画布视图(ctrl+-)，然后点击图像画布尺寸(Alt+Ctrl+C)，然后根据下面的截图设置参数。

-3-

。根据下图设置参数。-8-15新建一个图层，用画笔工具(B)

。根据下图设置参数。-8-15新建一个图层，用画笔工具(B)，选择白色的软笔刷，直径为300px,在

pagebutton“.36然后向下设置剪辑蒙板。-18--19-37选择刚刚的四个图层，点中ctr

und”上创建一个新图层。然后按照之前的操作，创建一个阴影。-41-71选择圆角矩形工具(U),设置

据下面的截图设置参数。-4-7在图层面板中点击背景图层，设置前景色为#6C821C，用油漆桶(G)填

6再一次选择图像画布尺寸(Alt+Ctrl+C)，然后根据下面的截图设置参数。

-4-

的矩形的上面，在图层面板上单击创建图层剪切蒙版。命名这个图层为“image“.-26-50

的矩形的上面，在图层面板上单击创建图层剪切蒙版。命名这个图层为“image“.-26-50选择文字工

，完成了！如果你按

剪辑蒙板（clippingmask）这个概念。右键点击图层“navigationbar”layer,

置图层透明度为40%。-11-设置主要内容的背景24双击“bg”图层，打开图层属性面板。根据下图进行

7在图层面板中点击背景图层，设置前景色为#6C821C，用油漆桶(G)填充背景。

-5-

按钮call-to-action-28-51好了，我们要在色项目”的底部创建两个按钮。选择圆角矩形工你的画布中间，画一个

按钮call-to-action-28-51好了，我们要在色项目”的底部创建两个按钮。选择圆角矩形工

你的画布中间，画一个1px大小的方框。41点击编辑定义图案。命名这个图案，然后点击ok。好了，你可

开图层属性面板。按照下面的截图进行参数设置。-39--40-68重复以上步骤，不过这一次是在丝带的右

档的顶端，写上整个站点的名字。75双击该图层，打开图层属性面板。按照下图进行参数设定。-44-76然

8在背景图层上面创建一个新图层，命名为”gradient“.

9在工具栏中选择渐变工具(G)，从画布头部开始向下拖拽出一个从白色到黑色的渐变。

10设置该图层渲染模式为颜色加深