PS设计导航：网页导航菜单

试谈PhotoShop制作简单的网站导航按钮(doc 7页)

试谈PhotoShop制作简单的网站导航按钮(doc 7页)
PhotoShop制作简单的网站导航按钮
设计工具为PS CS3，先看做好的效果图：
设计步骤如下：
第一步：用形状工具或者选框工具设计出菜单的背景来，如下图：
第二步：新建一个图层，用缩放工具放大到1000%，用画笔在这个新建图层上画出一条适当长度的1px竖线，
颜色为#ffffff；如下图：
第三步：给这个图层加"渐变叠加"这个混合选项，设置如下：
1处的颜色为白色竖线的下端附近的背景颜色值，2处的颜色为白色
竖线的上端附近的背景颜色值，
3处的颜色为#d7d7d7。

效果如下：
第四步：
复制这个图层，用箭头工具将复制的图层向左移动1px,修改渐变参
数，如下图：
效果如下：
100%比例下的效果如下：。

PS网页设计流程及操作指导

Photoshop网页设计案例教学网页框图Photoshop网页设计案例教学详细操作步骤：一、创建文件及布局参考线1、创建文件，大小990x1200像素，RGB模式，白色背景，如图所示：2、设置布局参考线：（1）横向5对参考线，分别为140/150、470/480、740/750、1010/1020像素；（2）纵向2对参考线，分别为325/335、660/670像素；3、将文件存储为“01创建文件及布局参考线.psd”。

效果如文件“01创建文件及布局参考线.psd”所示。

二、创建布局块之一（LeadStory）1、设置矩形选区框样式为“固定大小”，大小为660x320像素；2、在“视图”菜单下将“对齐到(T)”设置为“参考线”或者“全部”；3、在“背景”图层上新建图层，命名为“LeadStory”；4、选中图层“LeadStory”，用矩形选区框工具建立一个选区，将选区移动到位；5、将选区填充为灰色；6、将文件存储为“02创建布局块之一LeadStory.psd”。

效果如文件“02创建布局块之一LeadStory.psd”所示。

三、创建布局块之二（Story1-4）1、保持矩形选区框样式为“固定大小”，大小为325x260像素；2、在图层“LeadStory”上建立一个图层，命名为“Story1”；3、选中图层“Story1”，用矩形选区框工具建立一个选区，将选区移动到位；4、将选区填充为灰色；5、用同样方法建立相同大小的图层Story2、Story3、Story4；6、将文件存储为“03创建布局块之二Story1-4.psd”。

效果如文件“03创建布局块之二Story1-4.psd”所示。

四、创建布局块之三（FeatureStory）1、保持矩形选区框样式为“固定大小”，大小为320x260像素；2、在图层“Story4”上建立一个图层，命名为“FeatureStory”；3、选中图层“FeatureStory”，用矩形选区框工具建立一个选区，将选区移动到位；4、将选区填充为灰色；5、将文件存储为“04创建布局块之三FeatureStory.psd”。

如何使用Photoshop设计独特的网页导航栏

如何使用Photoshop设计独特的网页导航栏在当今数字时代，网页设计是至关重要的。

要吸引用户并让他们留在您的网站上，良好的导航栏设计是必不可少的。

今天我们将谈论如何使用Photoshop来设计独特的网页导航栏。

一、了解网页导航栏的重要性首先，让我们了解一下网页导航栏的重要性。

导航栏不仅仅是帮助用户在网站上导航的工具，它还是网站风格和品牌形象的重要组成部分。

一个独特而吸引人的导航栏可以提高用户体验和留存率。

因此，在设计导航栏时，应该考虑到用户需求、品牌特色以及整体网站风格。

二、了解Photoshop的基本工具和功能在设计网页导航栏之前，我们需要了解基本的Photoshop工具和功能。

Photoshop是一款功能强大的图像处理软件，它提供了许多工具和特效，可以大大提升设计效果。

熟悉并掌握这些工具对于设计出独特的网页导航栏来说至关重要。

三、确定导航栏的风格和颜色在设计导航栏之前，我们需要确切地确定导航栏的风格和颜色。

根据网站的主题和目标受众，可以选择不同的风格，例如扁平化设计、材料设计或立体设计。

颜色方面，应与品牌形象和整体网站风格保持一致，并考虑到可读性和吸引力。

四、创建导航栏的背景设计导航栏的第一步是创建背景。

使用Photoshop的矩形工具（或样式化的矩形工具）绘制一个与网页宽度匹配的矩形，作为导航栏的背景。

根据设计需求，可以选择渐变、纯色或背景图像作为背景。

五、添加导航链接接下来，我们需要为导航栏添加链接。

使用Photoshop的文本工具，在导航栏上添加相应的文本，例如“首页”、“关于我们”、“产品”等。

这些文本应该以易读、清晰的字体显示，并且要具有足够的对比度，以确保用户能够清楚地看到它们。

六、设计导航栏的悬停效果设计独特的网页导航栏需要考虑到用户的交互体验。

悬停效果是一种常见的交互效果，当用户将鼠标悬停在导航链接上时，链接变色或变形。

通过使用Photoshop的图层样式或形状工具，可以轻松地为导航链接添加悬停效果。

Photoshop制作丝带纹理风格网页导航

您喜欢这种效果吗?今天否本带大家一起来看看它究竟是如何制作出来的!首先在Photoshop中新建一个文档-约500 × 500大小，并填满#dac8aa 的颜色。

现在，我们找一个类似纸张纹理的素材。

您可以随意寻找自己喜欢的自然纹理，然后执行“去色”快捷键Ctrl+Shift+U ：之后，改变图层模式为：叠加，改变不透明度为60%。

合并两个图层。

Ok,为了表现纸质的密度，我们再使用“锐化”来加强质感，可以适当多来几次。

现在我们开始创建彩带。

首先用矩形选框工具创建如图的选区，并填充为绿色(#95b900)记得要在新图层完成哦!。

以同样的方式创建黄色(#e9db03)和红色(#b94a00)两个颜色的彩带。

接下来我们要保证三种颜色的彩带是在同一图层的情况下按Ctrl+J复制出一个新的彩带!并旋转如图角度：原来的层同样要旋转，使他们之间产生交叉。

现在我们选择底层的彩带，按住CTRL点击图层面板中的此层，得到他的选区，新建一层，使用渐变工具创建出一个阴影。

渐变使用黑色——透明的方式!接下来我们合并除“纸层”以外的图层，也就是说让彩带变为一体。

接着使用多边形套索工具，选中如图所示的范围进行删除!我们使用文字工具为飘带添加一些文字装饰，记得是用“自由变换”命令对文字进行旋转调整!。

同样我们将文字层和彩带层合并，添加如图所示图层样式。

现在，效果应该是这样的，多了一些阴影：接下来我们给彩带增添一些布纹的真实感，选用滤镜“> 纹理”选择纹理化：我们可以看到彩带有了凸凹感：然后到下一个步骤。

为了使我们的彩带更具立体感我们使用颜色减淡工具(大小：125像素，范围：高光，曝光：20%)，我们在需要的位置上进行涂抹，注意不要涂抹过量，我们会得到如下效果：同样我们相反的使用颜色加深工具(大小：80像素，范围：阴影，曝光：30%)，将彩带旁边进行减暗，这样做的目的是增加亮度对比度，使之更具立体感。

我们需要添加一些网格，让它看起来更像织布。

ps网站导航简单制作

练习27-网站导航本练习通过图层样式和渐变制作外型，再通过蒙板扣出多余的部分，最后形成了一个凹陷的网站导航。

学习知识：1、掌握形状工具的应用；2、掌握钢笔工具的应用；3、掌握图层样式的综合应用；操作步骤：1、选择菜单“文件”-“新建”命令，设置参数如图1所示。

图1 新建文件2、在工具箱上选择（圆角矩形工具U），设置“半径”为“20px”，画一个圆角矩形，填充任意颜色，如图2所示。

图2 画圆角矩形3、为矩形“形状1”添加图层样式，如图3所示。

图3 为“形状1”添加图层样式4、在画面上画一个稍大些的圆角矩形“形状2”，如图4所示。

图4 画一个稍大的圆角矩形5、为“形状2”添加图层样式，如图5所示。

图5 为“形状2”添加图层样式6、鼠标右击“形状2”图层，选择“栅格化图层”命令，用（钢笔工具P）画一个椭圆图形如图6所示，点鼠标右键把路径转换为选区，如图7所示。

图6 钢笔工具创建椭圆路径图7 将路径转换为选区7、按住“Alt”键不放，并在图层面板上选择（添加矢量蒙版）按钮，为“形状2”图层添加图层蒙版，效果如图8所示。

图8 为“形状2”添加“蒙版”得到按钮形状8、按“Ctrl+鼠标左键”点击图层“形状2”的“蒙版”缩略图，可以得到“蒙版”白色区域的选区，按“Shift+Ctrl+I”组合键进行选区反选，得到“蒙版”黑色区域选区，然后将选区移动到如图9所示位置。

图9 移动选区9、在选中图层“形状2”的“蒙版”前提下，用前景色黑色填充选区，得到效果如图10所示。

图10 用黑色填充选区得到按钮形状10、用同样的方法制作其它按钮，并添加上文字，为文字添加“图层样式”，最终效果如图11所示。

图11 最终效果。

Photoshop制作简单绚丽的导航效果

先看看效果吧! :)
第1步：新建文件，大小500x 200px ，选择渐变工具(G)，(径向渐变)从#363636到#252525。

最左边拖动到右下角。

第2步：新建层，选择选区工具(M)，固定大小为100 x 40px
第3步：填充线性渐变从#68ad40和#4c8c2c .
第4步：选着图层样式> 内发光> 渐变叠加> 描边#427a25
现在您的按钮应该是这样的.
第5步:新建层，同时选种新层和按钮层合并(ctrl+E)，现在做一些发光效果，加深工具(O)，笔头大小为45px，不透明度为10%，围绕按钮四周加深。

第6步：现在，选择减淡工具(O)，使用了一个14像素的软刷，不透明度为10%。

(小鱼提醒：选择高光)
第7步：复制按钮如图：
第8步：新建层，灰色到透明，选择编辑>变换>透视
第9步:降低透明度为10%。

第10步：最后，添加一些文字。

小鱼完成:)您呢(*^__^*) 嘻嘻……
小鱼完成:)您呢(*^__^*) 嘻嘻……。

Photoshop 网页设计实例——导航图标制作

Photoshop 网页设计实例——导航图标制作一个网站导航系统的基础是网站的栏目设置，在设计上除了使用纯文字和图标之外，还可以在导航栏上放置相应内容的图形设计。

这样不仅可以美化网站，还可以形象的表达栏目含义。

在制作过程中要配合相应的栏目，放置在网页中的效果，如图1-47所示。

图1-47 网络网页操作步骤：（1）新建一个【宽度】和【高度】分别为1100和800像素，白色背景文档。

新建“图层1”，设置前景色为黑色。

使用【圆角矩形工具】，设置【圆角半径】为20像素。

创建固定大小圆角矩形，设置参数，如图1-48所示。

图1-48 绘制矩形（2）双击“图层1”，打开【图层样式】对话框。

启用【渐变叠加】选项，设置【角度】为21度。

添加渐变效果，设置参数，如图1-49所示。

图1-49 添加渐变效果（3）启用【斜面和浮雕】选项，设置【阴影强度】为144%；【斜面大小】为24像素，设置参数，如图1-50所示。

图1-50 添加立体效果（4）新建“图层2”，如同上例操作，使用【圆角矩形工具】，设置W为像素；H 为像素，绘制圆角矩形。

双击该图层，启用【渐变叠加】选项，设置参数，如图1-51所示。

图1-51 添加渐变效果（5）启用【斜面和浮雕】选项，设置【选区斜面位置】为“枕状浮雕”样式；【斜面大小】为9像素，设置参数，如图1-52所示。

图1-52 添加浮雕效果（6）新建“图层3”，使用【椭圆选框工具】。

按住Shift键，建立正圆选区，填充任意颜色。

取消选区，拷贝“图层2”的【图层样式】，如图1-53所示。

图1-53 绘制按钮（7）使用【钢笔工具】，建立路径。

新建“图层4”，按Ctrl+Enter快捷键，将路径转换为选区，填充白色。

取消选区，设置该图层【不透明度】为20%，如图1-54所示。

图1-54 绘制高光（8）新建“图层5”，使用【圆角矩形工具】，绘制圆角矩形。

拷贝“图层1”的【图层样式】，并将该图层放置到“图层1”下方，如图1-55所示。

掌握使用Photoshop设计网页UI的核心方法

掌握使用Photoshop设计网页UI的核心方法【第一章：Photoshop界面与工具】Photoshop是一款功能强大的图像处理软件，也是设计师们常用的工具之一。

如果想要掌握使用Photoshop进行网页UI设计的核心方法，首先需要了解软件的界面与工具。

1.1 界面布局Photoshop的界面布局由菜单栏、工具栏、选项栏、面板和画布等部分组成。

菜单栏位于软件的顶部，提供了各种功能选项。

工具栏位于左侧，默认显示了一些常用工具，可以根据需要进行自定义。

选项栏位于工具栏的下方，用于选择工具的不同选项和参数。

面板位于右侧，提供了各种功能面板，如图层、色彩、样式等面板。

画布就是我们进行设计的区域，位于中间。

1.2 常用工具Photoshop提供了丰富的工具，通过不同的工具可以实现不同的功能。

设计网页UI时常用的工具包括：矩形工具、椭圆工具、画笔工具、渐变工具、文本工具、取色器等。

矩形工具用于绘制矩形或正方形的形状；椭圆工具用于绘制圆形或椭圆形的形状；画笔工具可以自由绘制各种形状；渐变工具可以创建渐变效果；文本工具用于插入文字；取色器可以选择颜色。

1.3 快捷键掌握常用的快捷键可以提高工作效率。

在Photoshop中，一些常用的快捷键包括：Ctrl+S 保存文件、Ctrl+Z 撤销操作、Ctrl+J 复制图层、Ctrl+T 图层变换、Ctrl+G 图层分组、Ctrl+U 调整图像色彩等。

熟练掌握这些快捷键可以减少频繁的鼠标操作，提高设计速度。

【第二章：网页UI设计的基本要素】要想设计出吸引人的网页UI，需要掌握一些基本的设计要素，包括色彩搭配、布局规则、字体选择等。

2.1 色彩搭配色彩是网页设计中非常重要的因素之一。

合理的色彩搭配可以营造出不同的情绪和视觉效果。

在网页UI设计中，应根据网页主题和目标受众选择适合的色彩方案。

常用的色彩搭配方式包括：类似色搭配、互补色搭配、三角色搭配等。

通过调整调色板或使用色彩工具，可以轻松实现色彩搭配。

几款简洁导航条详细制作过程

一款精致的水晶风格按钮的制作网站制作中导航栏的设置非常重要。

漂亮的导航按钮和菜单会给网站增色不少。

下面介绍一款精致的水晶风格按钮的制作。

作者不仅介绍了按钮的制作还介绍了文字部分的制作方法，非常值得学习。

最终效果1、创建一个新文件600 * 140px。

现在选择圆角矩形工具制作一个圆角矩形如下图。

2、应用层样式：内发光，混合模式：滤色，方法：柔和。

3、渐变叠加：颜色设置为：#5e80a3，#839db8，#b8c7d6。

4、描边: #5e80a3。

5、这就是它应该呈现的样子。

6、现在打上菜单文字，字体Segoe，大小：14 pt，颜色白色#ffffff。

7、给字体链接应用层效果：描边 #53769a。

8、创建一个新层。

选择矩形选框工具，绘制1px宽度的线条并使用# ffffffs填充。

9、复制这个层接着在每个链接之间添加每个线条。

现在选择矩形选框工具选取线条底部的区域覆盖到所有的线条，然后使用选择- >修改- >羽化和应用5px半径。

按下Del然后采取相同的方法处理上方的线条。

10、将线条图层的混合模式改为柔光。

11、使用矩形选框工具选取你链接的内部区域（在两个线条之间）然后填充任何你想要的颜色。

12、现在给这个层应用混合模式渐变叠加使用颜色: #567595, #728fae #b3c3d3。

13、这就是它应该呈现的样子。

14、现在使用矩形选框工具2px的半径绘制一个小矩形使用#ffffff填充。

15、应用如下的层效果到形状图层: 内发光（混合模式：叠加）。

16、渐变叠加: #e6e6e6 和 #ffffff。

17、描边: #5e80a3。

18、这就是它应该呈现的样子。

19、在形状内输入“search”使用Segoe字体，大小为 12pt 颜色#7b7b7b。

最终效果：Photoshop制作一个精美的透明导航这photoshop教程介绍非常精致的导航栏的制作方法。

大致过程：先用做出自己想要的导航栏形状，然后分别对导航栏的高光及背景部分设置图层样式，做出水晶质感。

photoshop怎样绘制导航条

photoshop怎样绘制导航条photoshop怎样绘制导航条一个好的导航条肯定需要许多元素，并且信息也要准确。

但是很多同学还不太清楚。

那么接下来下面是店铺整理的一些关于photoshop怎样绘制导航条，供您参阅。

photoshop绘制导航条的方法打开PS，像制作普通图片一样制作一个导航条图片。

图片做好后，在PS中选择切片工具。

用鼠标均匀地拉出各个切片部分(我这里是八等份)。

这时，切换到“切片选择工具”。

在一个切片上双击。

在弹出的窗口中，分别填写好名称、URL、信息文本、Alt标记。

各部分功能解释如下：名称：随意，方便自己识别。

URL：当鼠标点击此切片时，要转到的位置(不仅可以是本地电脑上的位置，也可以是网络位置)。

信息文本：当鼠标移动到此切片时，在浏览器底部状态栏显示的提示文字。

Alt标记：Alt 标记。

在这里，介绍下获得URL的方法。

比如我想获得图片这个切片的URL，就在自己电脑上打开图片所在的文件夹，然后复制标题栏的路径过去即可。

按同样的方法，填写好各个切片的信息。

全部完成后，点击菜单“文件”-“存储为Web所用格式”。

在”存储为Web所用格式“窗口中，将图片格式改为JPEG，品质改为 60(当然你也可以把品质改为 100，这样图片效果就更好了，不过图片会稍微大一些)。

这样做的目的是为了做出来的导航条比较美观。

在保存对话框中，选择一个不含中文的文件名(可以是数字或字母)，然后在格式中选择“HTML和图像”，最后单击保存。

这时，有可能会弹出一个提示框，单击“取消”忽略即可。

保存成功后，会新增一个images文件夹和一个html文件。

PhotoShop制作滚动菜单栏教程

PhotoShop制作滚动菜单栏教程第一步–制作酒吧这很容易。

首先，制作一个宽度为400像素，高度为60像素的新文档。

使用图层面板中的图标。

选择矩形选择工具，然后在图像中心拖出一个大小为330 x 35像素的选择。

（为了简化此过程，选择选项中导航，信息，选项面板中，选择选项选项卡上，风格：选择固定尺寸，然后输入330的宽度和35的身高在图像窗口中，然后拖动不要忘记。

将样式切换回普通！）使用“编辑”菜单中的“填充”命令，用50％的灰色填充此矩形。

现在为圆端。

创建一个新层。

选择“椭圆选框”选择工具，然后将指针右移到矩形左边缘的中心。

按住Shift + Alt键（Windows）或Shift + Option键（Mac），拖出一个圆圈，直到圆圈的上边缘和下边缘恰好位于矩形的上边缘和下边缘（如果稍微放大一点可能会有所帮助）第一）。

也用50％灰色填充该圆圈。

现在将此层（“第2层”）向下拖动到调色板中的“新层”图标以进行复制。

按住Control键，然后在图像窗口中，将此重复的圆拖动到矩形的右侧，直到它从右侧边缘突出一半。

再次放大以精确定位圆。

现在按Control + E 3次（或选择“Layer”>“ Merge Down” 3次），以使您最终得到包含我们的圆形菜单栏的一层（“ Layer 1”）：双击“图层”调板中的图层，并将其重命名为“菜单栏”。

点击确定。

现在是保存图像的好时机！称它为menubar.psd。

制作文字选项现在，使文字按钮沿栏。

选择文本工具（大T！），然后选择您喜欢的字体。

键入所需的菜单选项，每个选项之间用4或5个空格分隔。

单击“确定”将文本放置在图像上，然后四处移动图层，直到文本在条形图上居中对齐为止：右键单击“图层面板”中的图层，然后选择“图层选项”，将新图层重命名为“菜单文本”。

获得砂岩效果让我们的菜单栏好看又颠簸，就像它是由砂岩制成的。

选择“菜单栏”图层，然后在“图层”调板中按Control键并单击该图层，以选择所有不透明像素（这将阻止效果“渗出”栏边缘）。

利用Adobe Photoshop软件创建网页图标和界面元素

利用Adobe Photoshop软件创建网页图标和界面元素Adobe Photoshop是一款功能强大的图像处理软件，被广泛应用于图形设计和网页开发领域。

本文将介绍如何利用Adobe Photoshop软件创建网页图标和界面元素，帮助网页设计师提高工作效率和图形设计质量。

首先，在使用Adobe Photoshop软件前，我们需要了解一些基本的设计原则和规范。

在网页设计中，图标和界面元素起到了概况信息和增强用户体验的作用，因此需要考虑以下几点：第一，简洁明了。

图标和界面元素应该具有简明的外观和直观的表达，避免过多的细节和装饰，以免分散用户的注意力。

第二，一致性。

在网页设计中，图标和界面元素需要与整体风格保持一致，包括颜色、形状和字体等。

这可以提高用户对网页的整体印象，增强品牌形象。

第三，符合用户习惯。

图标和界面元素的布局和功能应该符合用户的通用习惯和操作习惯，避免给用户带来困扰或混淆。

接下来，我们来具体介绍如何使用Adobe Photoshop软件创建网页图标和界面元素。

首先是图标的创建。

图标通常是一种简约、小巧的图形，并且具有独特的含义或功能。

我们可以通过以下步骤创建一个简单的图标：第一，确定图标的尺寸和形状。

根据网页的设计需求，确定图标的尺寸和外形。

一般来说，图标的尺寸较小，一般为20x20像素或30x30像素。

第二，选择适合的工具。

Adobe Photoshop提供了丰富的工具，如钢笔工具、形状工具和文本工具等，可以根据图标的特点选择合适的工具。

第三，绘制图标。

使用所选工具按照设计要求绘制图标的形状和细节。

可以使用不同的图层来组织和管理图标的元素。

第四，添加颜色和效果。

为图标选择适合的颜色和效果，可以使用渐变、阴影和边框等效果来增强图标的立体感和可视效果。

其次是界面元素的创建。

界面元素是网页中的各种交互控制元素，如按钮、导航栏和选项卡等。

我们可以按照以下步骤创建一个简单的界面元素：第一，确定界面元素的尺寸和布局。

Photoshop导航器和动作的技巧(画布与通道快捷键)

Photoshop导航器和动作的技巧大家用photoshop用的久了，就觉会得很多时候用键盘来控制导航器(navigation)比用鼠标更快捷。

这里列出了一些常用的导航器快捷键：Home=到画布的左上角End=到画布的右下角PageUp=把画布向上滚动动一页PageDown=把画布向下滚动动一页Ctrl+PageUp=把画布向左滚动动一页Ctrl+PageDown=把画布向右滚动动一页Shift+PageUp=把画布向上滚动10个像素Shift+PageDown=把画布向下滚动10个像素Ctrl+Shift+PageUp=把画布向左滚动10个像素Ctrl+Shift+PageDown=把画布向右滚动10个像素使用Ctrl+Tab/Ctrl+F6在多个文档中切换(或者也可以使用Window菜单)，十分方便！用恢复命令[F12](File>Revert)可以把当前文档恢复到上次保存时的状态。

警告：在Photoshop5.0中，恢复命令会同时清空历史记录！这意味着一旦使用恢复命令上次保存后所有的改动都会丢失！Photoshop5.5更正了这一点。

通道也有其默认对应的热键。

这对于存为通道形式的选区/蒙板之间作加、减和相交运算就变得十分快捷和简单。

这里列出了一些常用模式：RGB颜色CMYK颜色索引颜色Ctrl+“~”=RGBCtrl+1=红Ctrl+2=绿Ctrl+3=蓝Ctrl+4=其它通道Ctrl+9=其它通道Ctrl+“~”=CMYKCtrl+1=青色Ctrl+2=洋红Ctrl+3=黄色Ctrl+4=黑色Ctrl+5=其它通道Ctrl+9=其它通道Ctrl+1=索引Ctrl+2=其它通道Ctrl+9=其它通道例如：要创建一个选区以表示通道7和通道9的相交部分，先按Ctrl+Alt+7(把通道7载入为选区)然后按byCtrl+Alt+Shift+9(再和通道9相交)。

按住Ctrl键在导航器的代理预览区域中拖放可以更新设定当前文档的可视区域。

photoshop菜单栏及浮动功能面板

一、菜单栏与浮动功能面板PhotoShop作为目前最流行的图像处理应用软件，自问世以来就以其在图像编辑、制作、处理方面的强大功能和易用性、实用性而备受广大计算机用户的青睐。

现在，它的开发公司——Adobe又专门针对中国用户对其最新的5.02版进行了全面汉化，使得这一图像处理的利器更容易被我们所掌握和使用。

下面，就让我们一起打开神秘的PhotoShop之门，走入绚丽多彩的图像世界。

安装好PhotoShop 5.02中文版并运行它后，会出现如图1所示的界面，它包含菜单栏、工具箱、浮动功能面板三个部分，我们先看看它的菜单栏与浮动功能面板。

图1菜单栏PhotoShop 5.02中文版的菜单栏包括9个下拉式功能菜单。

“文件”菜单：和一般的应用软件相似，它主要提供了包括新建、打开、存储为、置入（即导入）、页面设置、打印等功能。

其中，“恢复”命令用于将当前编辑的文件恢复为上一次存盘时的状态，“预置”命令用于对PhotoShop 5.02中文版的一些默认参数进行重新设定。

“编辑”菜单：包含了剪切、拷贝、粘贴、填充等一系列编辑命令。

其中的“自由变换”和“变换”两个命令在实际工作中经常用到，我们将在以后学习。

“图像”菜单：用于分析、修改和调节图像的颜色、尺寸，改变图像的模式。

“图层”菜单：包括对“层”进行各种操作的命令，如“层”的建立、删除、储存、融合、合并等，及“效果”和“合并图层蒙版”中较重要的命令。

“选择”菜单：用于选定图像的某一区域或整体，“修改”和“羽化”是其中较为重要的命令；“滤镜”菜单：包含各种用于对图像进行特效处理的滤镜，是PhotoShop的重点所在；“视图”菜单：用于对图像窗口的缩放进行控制，显示或隐藏、参考线、标尺，提供栅格功能等；“窗口”菜单：用于打开或隐藏PhotoShop的各种功能面板、重新组织窗口的排列、控制状态栏的显示等。

“帮助”菜单：为用户提供各种帮助，但其中也包括“调整图像”、“色彩管理向导”、“管理透明图像”三个重要命令。

使用PhotoShop制作斜纹质感网页导航按钮教程

使用PhotoShop制作斜纹质感网页导航按钮教程
使用PhotoShop制作斜纹质感网页导航按钮教程
用PhotoShop制作一种斜纹质感的网页导航按钮效果，简单易学。

效果图：
大家好，下面由我来开始教如何做上图效果的简单按钮：
1.首先打开photoshop软件，Ctrl+N新建一个10 x 10px的72dpi(分辨率)的文件：
①.我们先在图层面板新建一个新的`图层，然后把背景图层删除(可按del键快捷键)
②.接着在“导航器”把界面放到最大可按ctrl+"+" 快捷键，然后选择矩形选框工具，再选择上面的“添加到选区”，然后按照下图选出那样的选区
并填充(alt+)为白色：
③接着按快捷键alt+A全选图层，再选择“编辑”菜单，往下看，找到“定义图案”，确定!
2.接着再新建一个新的文件，500 x 300 px，300dpi(分辨率)，确定,背景层填充为深灰色(#494949)!下面我们将开始制作按键!
①我们首先新建一个图层，再用选框工具选出自己需要的大小按钮，填充为黑色。

Photoshop绘制仿真塑料效果的网页导航

本教程主要用Photoshop来绘制一个塑料效果的网站导航条,最终效果非常的时尚,符合现在的网页设计潮流. 先看看效果吧!:)第一步：新建文件800x259px，选择渐变(快捷键G)背景色#8caab8 ，前景颜色#e1e8eb第二步：选择圆角矩形，大小为763x80px，颜色为#7fa1b3,然后选择图层样式>内阴影内阴影颜色#7dc8e8,如图所示：第三步：在圆角矩形下面新建层，载入圆角矩形选区(按ctrl+鼠标点击图层)，填充颜色#86a6b5，取消选区(快捷键ctrl+D)，选择滤镜>模糊>高斯模糊(值为1.8px),然后选择滤镜>模糊>动感模糊(值为90度，41px)，再用高斯模糊(值为1.8px)，设置该层的不透明度为85%。

效果如图所示：第四步：在圆角矩形下面新建层，载入圆角矩形选区(按ctrl+鼠标点击图层)，填充颜色为#678a9f，取消选区(快捷键ctrl+D),选择滤镜>模糊>高斯模糊(值为4.5px)效果如图：第五步：在圆形矩形下面新建层，载入圆角矩形选区(按ctrl+鼠标点击图层)，向下移动10px，选择渐变工具(快捷键G)，从透明到#6d838f，从左下角中步右下角拉渐变，如图箭头所示：第六步：取消选择(快捷键ctrl+D),选择滤镜>模糊>高斯模糊(值为3.6px)。

第七步：在最上方新建层，载入圆角矩形选区(按ctrl+鼠标点击图层)，向下移动1px，选择渐变工具(快捷键G)从#92c2da到透明，从上到下10px左右高度内拉渐变，参考图：第八步：新建层，载入圆角矩形选区(按ctrl+鼠标点击图层)，向上移动40px，选择渐变工具(快捷键G)，从#bcd2db到透明，取消选区(快捷键ctrl+D)然后选择滤镜模糊高斯模糊(值为3.6)，参考图：第九步：新建层，使用45px软刷，颜色为#b8c9d1，然后选择滤镜>模糊>高斯模糊(值为4px),设置不透明度为50%，如图所示：第十步：新建层，选择80px软刷，颜色为#d3e7f1，给导航增加反光效果，如图所示：第十一步：新建层，载入圆角矩形选区(按ctrl+鼠标点击图层)向下移动1px，选择渐变(快捷键G)，从#fbfcfd 到透明(径向),取消选区(ctrl+D)，选择>滤镜>模糊>高斯模糊(值为3.0)，用软刷在右上角增加反光，如图所示：第十二步：输入自己喜欢的文字，选择图层样式>投影>外发光如图所示：第十三步：输入第二种文字，设置图层样式>外发光>描边，设置如图：第十四步：输入第三种文字，设置图层样式>外发光,如图所示：看下最终效果吧!。