Photoshop 水晶风格网站导航条制作教程
PS真功夫 发布时间：2010-03-05 15:43:19 作者：佚名 
我要评论
我要评论网站制作中导航栏的设置非常重要。漂亮的导航按钮和菜单会给网站增色不少。下面介绍一款精致的水晶风格按钮的制作。作者不仅介绍了按钮的制作还介绍了文字部分的制作方法，非常值得学习。
最终效果
1、创建一个新文件600 * 140px。现在选择圆角矩形工具制作一个圆角矩形如下图。
2、应用层样式：内发光，混合模式：滤色，方法：柔和。
3、渐变叠加：颜色设置为：#5e80a3，#839db8，#b8c7d6。
4、描边: #5e80a3。
5、这就是它应该呈现的样子。
6、现在打上菜单文字，字体Segoe，大小：14 pt，颜色白色#ffffff。
7、给字体链接应用层效果：描边 #53769a。
8、创建一个新层。选择矩形选框工具，绘制1px宽度的线条并使用# ffffffs填充。
9、复制这个层接着在每个链接之间添加每个线条。现在选择矩形选框工具选取线条底部的区域覆盖到所有的线条，然后使用选择- >修改- >羽化和应用5px半径。按下Del然后采取相同的方法处理上方的线条。
#p#
10、将线条图层的混合模式改为柔光。
11、使用矩形选框工具选取你链接的内部区域 （在两个线条之间）然后填充任何你想要的颜色。
12、现在给这个层应用混合模式渐变叠加使用颜色: #567595, #728fae #b3c3d3。
13、这就是它应该呈现的样子。
14、现在使用矩形选框工具2px的半径绘制一个小矩形使用#ffffff填充。
15、应用如下的层效果到形状图层: 内发光（混合模式：叠加）。
16、渐变叠加: #e6e6e6 和 #ffffff。
17、描边: #5e80a3。
18、这就是它应该呈现的样子。
19、在形状内输入“search”使用Segoe字体，大小为 12pt 颜色#7b7b7b。
最终效果：
1、创建一个新文件600 * 140px。现在选择圆角矩形工具制作一个圆角矩形如下图。
2、应用层样式：内发光，混合模式：滤色，方法：柔和。
3、渐变叠加：颜色设置为：#5e80a3，#839db8，#b8c7d6。
4、描边: #5e80a3。
5、这就是它应该呈现的样子。
6、现在打上菜单文字，字体Segoe，大小：14 pt，颜色白色#ffffff。
7、给字体链接应用层效果：描边 #53769a。
8、创建一个新层。选择矩形选框工具，绘制1px宽度的线条并使用# ffffffs填充。
9、复制这个层接着在每个链接之间添加每个线条。现在选择矩形选框工具选取线条底部的区域覆盖到所有的线条，然后使用选择- >修改- >羽化和应用5px半径。按下Del然后采取相同的方法处理上方的线条。
#p#
10、将线条图层的混合模式改为柔光。
11、使用矩形选框工具选取你链接的内部区域 （在两个线条之间）然后填充任何你想要的颜色。
12、现在给这个层应用混合模式渐变叠加使用颜色: #567595, #728fae #b3c3d3。
13、这就是它应该呈现的样子。
14、现在使用矩形选框工具2px的半径绘制一个小矩形使用#ffffff填充。
15、应用如下的层效果到形状图层: 内发光（混合模式：叠加）。
16、渐变叠加: #e6e6e6 和 #ffffff。
17、描边: #5e80a3。
18、这就是它应该呈现的样子。
19、在形状内输入“search”使用Segoe字体，大小为 12pt 颜色#7b7b7b。
最终效果：
相关文章
今天的教程是教给大家做一个非常有圣诞氛围的圣诞快乐按钮，充满浓浓的圣诞节日气息，小伙伴们还不快快打开PS一起来学习2021-06-16
ps2021怎么做漂亮的渐变按钮？ps中想要设计一款领券的按钮，如果添加渐变色会更加显眼，该怎么设计渐变色按钮呢？下面我们就来看看ps按钮样式的设计方法，详细请看下文介绍2021-05-27
很多人人物游戏按钮只能用AI才能设计，其实不然，一些按钮不只可以用AI设计，PS照样可以，今天我们就教大家制作一个蓝色科技金属质感的“play”按钮，一起来学习吧2021-05-18
ps怎么设计配色干净扁平化按钮？很多时候我们会看到各种按钮，想要设计一款颜色干净清爽的扁平化按钮，该怎么操作呢？下面我们就来看看ps按钮矢量图的设计方法，需要的朋友2021-04-08
怎么用PS制作按钮形状效果？下面这边文章主要为大家讲述了用PS制作按钮形状效果的教程，感兴趣的小伙伴来学习吧2020-12-15
ps怎么设计圆形的不锈钢金属按钮图标？ps中想要设计一款圆形的按钮，该怎么设计这个按钮矢量图呢？下面我们就来看看详细的教程，需要的朋友可以参考下2019-06-30
PS怎么设计可爱的按钮？ps中想要设计一款可爱的按钮，该怎么设计呢？下面我们就来看看ps设计按钮的教程，需要的朋友可以参考下2018-10-30
ps怎么设计逼真的玻璃质感按钮？ps中想要设计一款漂亮的玻璃按钮，该怎么设计逼真透明的玻璃按钮呢？下面我们就来看看详细的教程，需要的朋友可以参考下2018-09-23
ps怎么设计创意的圆形按钮？ps中想要设计按钮，该怎么设计创意的按钮图标呢？下面我们就来看看详细的教程，需要的朋友可以参考下2018-08-09
PS怎么设计左右轮播图的按钮？网页中经常能见到多张图片轮播的效果，会有左右按钮，该怎么设计这个按钮呢？下面我们就来看看详细的教程，需要的朋友可以参考下2018-08-09
最新评论