稻草人的精品收藏站——致力于平面设计与页面工

返回首页
当前位置: 本站首页 > 职业技法 > 网页美工 >

PhotoShop制作黑色荧光质感网页导航条

时间:2009-04-24 19:37来源:互联网 作者:秩名 点击:
效果如下: 1.首先让新建一个大小为700像素300像素文件。 2.将 背景 色改为#19191b 。 3.接下来,让我们使用圆角矩形 工具 ,设置半径为10px ,画一个圆角矩形: 副标题 4.设置这个

效果如下:

按此在新窗口浏览图片

1.首先让新建一个大小为700像素×300像素文件。

按此在新窗口浏览图片

2.将背景色改为#19191b 。
3.接下来,让我们使用圆角矩形工具,设置半径为10px ,画一个圆角矩形:

按此在新窗口浏览图片

4.设置这个图层的混合选项:颜色叠加#19191b;

描边:大小1px;内部;不透明度3%;填充类型渐变;有白到黑反向;线性;

按此在新窗口浏览图片

 

按此在新窗口浏览图片

5、下一步,我们要添加一个渐变给它。我用圆角矩形工具,半径为10px, 画一个圆角矩形;如下所示。

按此在新窗口浏览图片

6、设置透明度到22 % ,并设置图层样式为柔光。

按此在新窗口浏览图片

7、现在可以添加一些文字链接,当前链接使用#01c6fd 。 所有其他的链接,请使用此文字颜色#8e959d 。

按此在新窗口浏览图片

8、文字层加入投影,输入下面的混合选项:

按此在新窗口浏览图片

9、接下来我们要做的就是添加一些链接分割线,使用选框工具创建一个2px宽矩形;填充黑色:
10、给分割线输入下面的混合选项:

按此在新窗口浏览图片

 

按此在新窗口浏览图片

11、降低不透明度至50 %
12、接下来复制分割线,并将其放置在每一个链接之间

按此在新窗口浏览图片

13、用多边形套索工具并创建一个选择区如下所示。箭头表明当前链接:

按此在新窗口浏览图片

14、创建一个新层和填补#ffffff ,然后给这层输入下面的混合选项,

按此在新窗口浏览图片

 

按此在新窗口浏览图片

15、您的结果将如下所示:

按此在新窗口浏览图片

16、为当前链接做闪光效果,我们需要使用椭圆选框工具并且羽化15px,并填充颜色#01c6fd :

按此在新窗口浏览图片

 

按此在新窗口浏览图片

17、现在,我们要删除导航框以外的闪光。 找到导航框层,用CTRL +鼠标左键点击来选择它。回到闪光效果层

然后->选择>反向,然后->编辑>清除:

按此在新窗口浏览图片

18、现在降低透明度31 %左右,就完成了!

按此在新窗口浏览图片

最终效果!

按此在新窗口浏览图片

(责任编辑:admin)
顶一下
(0)
0%
踩一下
(1)
100%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
验证码:点击我更换图片
推荐内容