Photoshop制作网站导航教程

樱桃小园子sky

樱桃小园子sky

2016-02-16 06:00

下面是个简单易学的Photoshop制作网站导航教程教程,图老师小编详细图解介绍包你轻松学会,喜欢的朋友赶紧get起来吧!

先看效果图。

Photoshop制作网站导航教程,PS教程,图老师教程网

新建文档560x300像素,背景黑色,建新层,画一白色圆角矩形。

Photoshop制作网站导航教程,PS教程,图老师教程网

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/ps/)

添加图层样式。

Photoshop制作网站导航教程,PS教程,图老师教程网

Photoshop制作网站导航教程,PS教程,图老师教程网

Photoshop制作网站导航教程,PS教程,图老师教程网

颜色请采样我的截图,效果如下(局部)

Photoshop制作网站导航教程,PS教程,图老师教程网

新建图层1,调出圆角矩形选区,填充白色,把选区左挪2像素。(最后的效果里我修改了一下,挪了1像素)

Photoshop制作网站导航教程,PS教程,图老师教程网

删除,图层模式改为叠加,重复这个步骤,做出导航2端的亮边。

Photoshop制作网站导航教程,PS教程,图老师教程网

输入一些白色文字,比如关于我们 联系方式博客等等,添加图层样式。

Photoshop制作网站导航教程,PS教程,图老师教程网

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/ps/)

Photoshop制作网站导航教程,PS教程,图老师教程网

下面制作鼠标悬浮框,就是鼠标移到文字上面时,会有不同的视觉样式呈现,一般用CSS来完成,建新层,做一矩形选区,透明到黑径向渐变。

Photoshop制作网站导航教程,PS教程,图老师教程网

图层模式柔光,不透明度90%。

Photoshop制作网站导航教程,PS教程,图老师教程网

建新层,做如下矩形选区,填充白色。

Photoshop制作网站导航教程,PS教程,图老师教程网

添加蒙版,黑白对称渐变,图层不透明度90%,可能会有超界的白边,用笔刷涂抹掉即可。

Photoshop制作网站导航教程,PS教程,图老师教程网

这样,一个简单的网站导航就制作完成了,本ps教程到此结束。

Photoshop制作网站导航教程,PS教程,图老师教程网

展开更多 50%)
分享

猜你喜欢

Photoshop制作网站导航教程

PS PS基础
Photoshop制作网站导航教程

Photoshop制作立体效果的网站导航教程

PS PS基础
Photoshop制作立体效果的网站导航教程

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

photoshop制作网站酷炫导航条

PS PS基础 ps平面设计教程 ps去水印教程
photoshop制作网站酷炫导航条

Photoshop设计制作网站深蓝色金属感导航教程

PS PS基础 ps平面设计教程 ps去水印教程
Photoshop设计制作网站深蓝色金属感导航教程

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

Photoshop制作水晶风格网站导航条

PS PS基础 PS效果
Photoshop制作水晶风格网站导航条

CSS实例教程:制作网站横向导航

Web开发
CSS实例教程:制作网站横向导航

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

Photoshop调出夏日美女金黄色调

Photoshop调出夏日美女金黄色调

Photoshop制作梦幻的蓝色浮雕字教程

Photoshop制作梦幻的蓝色浮雕字教程
下拉加载更多内容 ↓