[PS教程] PS制作一款超酷的黑色网站导航条

[复制链接]
宗卓然 2013-11-28 08:54:30
你是否有自己的网站呢?你的网站是否也有本教程中所示的超酷的黑色导航条呢?本教程我们就利用photoshop快速有效的制作一款酷黑导航添加到你的网站中.
先看酷酷的最终效果图吧:
13CTMDW0-13139.jpg
步骤1:基本要领
新建新的psd文档,宽度700px,高度160px,背景色以黑灰色(#2b2b2b)填充。
创建图层,图层属性为“导航条”,选取圆角矩形工具,设定前景色为黑色(#000000)见下图相同画一矩形条(长度与宽度可自行处理)。
13CTMDW0-13139.jpg
步骤2:设定图层样式
双击“导航条”图层或选取“导航条”图层,单击右键,在下拖菜单中选取混合选项菜单,把出现“图层样式对话框”。
单击左半复选项框中的“外发光”,并且见下图执行设定:
13CTMDW0-13139.jpg
再单击左半复选项框中的“斜面与浮雕”,并且见下图执行设定:
13CTMDW0-13139.jpg

                                                             
        然后,单击左半复选项框中的“渐变叠加”,见下图执行设定:
13CTMDW0-13139.jpg
做完上面过程后,你的导航条把会是这个样子:
13CTMDW0-13139.jpg
步骤3:提高高光
创建图层,设定前景色为白色(#ffffff),选取矩形工具,用白色矩形条覆遮导航条的上半部,选取橡皮工具擦除左上角与右上角的白色,显示导航条的圆角外形,见下图:
13CTMDW0-13139.jpg
将此图层的透明度降低为4%,导航条把会见下图:
13CTMDW0-13139.jpg
步骤4:制造发光
创建图层,设定前景色为#2a5368。
从画笔工具中选取预设画笔,并设定大小为360px。运用画笔,在导航条上面中央画一圆形区域,设定图层透明度为65%(个人可斟酌减少或者提高),选取橡皮工具擦除不属于导航条的发光区域,见下图:
13CTMDW0-13139.jpg
剩下要做的就是加上菜单按钮(自行设计),运用白色或者灰色就可以了。
完好的导航条华丽丽的出炉了:

但愿你喜爱!
颛孙雪羽 2013-11-28 09:04:44
众里寻他千百度,蓦然回首在这里!
回复

使用道具 举报

邬世韵 2013-11-29 20:24:13
我也是坐沙发的
回复

使用道具 举报

闻人逸致 2013-11-29 20:27:58
好帖必须得顶起
回复

使用道具 举报

花清嘉 2013-11-30 09:00:59
支持,楼下的跟上哈~
回复

使用道具 举报

锺楠楠 2014-3-19 21:20:41
打酱油的人拉,回复下赚取积分
回复

使用道具 举报

高文静 2014-3-23 17:30:05
是爷们的娘们的都帮顶!大力支持
回复

使用道具 举报

王浓绮 2014-3-25 21:57:35
为保住菊花,这个一定得回复!
回复

使用道具 举报

晏洛灵 2014-4-3 11:00:00
非常好,顶一下
回复

使用道具 举报

陶金枝 2014-4-8 13:42:31
大人,此事必有蹊跷!
回复

使用道具 举报

郦幻香 2014-4-8 19:06:16
围观 围观 沙发在哪里!!!
回复

使用道具 举报

通菁英 2024-8-20 18:09:47
路过的帮顶
回复

使用道具 举报

墨含香 2024-11-2 08:17:32
高手云集 果断围观
回复

使用道具 举报

相珑玲 2024-12-9 10:14:32
我只是路过,不发表意见
回复

使用道具 举报

相珑玲 2025-1-27 22:42:38
边撸边过
回复

使用道具 举报

司马蓓蕾 2025-3-12 08:14:32
发发呆,回回帖,工作结束~
回复

使用道具 举报

雍旎旎 2025-4-10 16:02:41
不错 支持下
回复

使用道具 举报

刘吉帆 2025-4-27 09:05:30
回个帖子,下班咯~
回复

使用道具 举报

阳怡然 2025-5-6 14:25:45
确实不错,顶先
回复

使用道具 举报

尉迟琴雪 2025-5-10 07:35:50
我是个凑数的。。。
回复

使用道具 举报

手机版

GMT+8, 2025-5-29 13:54

Copyright © 2012 技术派 | 技术支持:技术派设计

Powered by Discuz! X3.4