当前位置 >> photoshop>>导航设计-一个漂亮而实用的导航

上一篇:« CSS入门-五个简单,但有用的CSS属性 下一篇:ps网页-电脑网站的设计 »

导航设计-一个漂亮而实用的导航

发布时间:2009年12月3日 次浏览:

话不多说来看一下效果图是什么样的.



1.打开PS新建一个新文档,尺寸大小由你的网站规格决定.并填充背景#1a1a1a.(木木:在这一步你可以新建一个图层,这样好方便你以后的修改.)

2.双击该图层,弹出图层样式,选择颜色渐变.并设置如下:

3.为了增强效果,添加内阴影.

4.新建一个图层,并便用矩形选区工具,在导航上画出一个矩形大小约有原来的一半.填充#FFFFFF.透明度40%,更改混合模式:叠加.

5.现在来做一个光标滑过的效果.用矩形工具画出一个小矩形来做按扭.并设置如下图:
效果如图:

 

 

 


6.用文字工具来为导航来添加文字,并使用图层样式加一个描边.

 

 


7.在按扭图层上也为其添加文字效果设置如图:

8.效果如图:

PSD下载:

--------------------------------------------------

转载请注明链接,木木在此谢谢了.

www.ximumu.cn--专注国外网页教程,PS教程,CSS教程.

分享家:Addthis中国

全部评论(7条)

  • 7楼发表于:2009-12-4 22:11:13

    不错,来顶一个

  • 回复
  • 6楼发表于:2009-12-3 20:34:28

    很不错的教程啊,收下了

    夕木木 于 2009-12-4 11:18:07 回复
    呵呵,喜欢就好.

  • 回复
  • 5楼发表于:2009-12-3 20:23:07

    是用的渐变效果,很好看哦

  • 回复
  • 4楼发表于:2009-12-3 17:57:44

    看起来还不错 呵呵~

  • 回复
  • 3楼发表于:2009-12-3 17:21:34

    适合做个人站

    夕木木 于 2009-12-4 11:18:43 回复
    商业站也行哟.

  • 回复
  • 2楼发表于:2009-12-3 14:06:00

    嗯,学这些要非常有耐心的,急不来,加油

  • 回复
  • 1楼发表于:2009-12-3 13:56:37

    好复杂,一下学不来

  • 回复

发表评论

(必填)

(必填)