网站图片导航设计制作全过程
下面是我做的一个导航效果，当鼠标放到按钮上的时候就会变化一种颜色。做到这样的效果你需要两个软件第一个是photoshop，用于制作基本的按钮图片，第二个软件是dreamweaver，将图片做成导航栏。下面是具体的方法：
操作方法
- 01
先打开photoshop，我们来制作导航图片，新建一个图片，高度和宽度分别为500和300，点击确定按钮
- 02
先绘制一个按钮，使用矩形选框工具，画一个如图所示的矩形，然后使用油漆桶工具，将矩形选框涂成白色
- 03
这时候矩形选框还在，在菜单栏上执行：选择---修改---收缩，我们来缩小一点矩形选框，在弹出的对话框中，设置收缩量为1，点击确定按钮
- 04
新建一个图层2，将图层2放到图层1的上面
- 05
使用渐变填充，给图层2添加一个渐变效果，如图所示
- 06
双击图层2的缩略图，打开图层样式对话框，添加投影效果，设置参数如图所示，这个参数主要设定不透明度和距离，那你要根据自己的需要设定参数，看着图片的效果，选择最合适的参数
- 07
最后使用文字工具，添加文字home，也就是主页的意思
- 08
下面我们就要裁剪一下图片，在菜单栏上执行：图像---裁切。
- 09
在打开的对话框中，设置基于左上角像素颜色，然后点击确定按钮。
- 10
这是我们得到的最后按钮效果，灰色部分不是图片，是ps的背景色。将该按钮图片保存到网站的图片文件夹下。
- 11
用同样的方法做出其他的导航上的按钮，如图所示：我们看到有两种颜色的按钮，对喽，因为按钮点击的时候会有一个按下弹出的效果，所以我们要用两张图片来展示这种效果
- 12
打开dreamweaver软件，插入一个表格作为导航栏，如图所示，在菜单栏上执行：插入---表格，插入一个三行一列的表格
- 13
将光标移动到第一个单元格，然后在菜单栏上执行操作：插入--图像对象----鼠标经过图像
- 14
在打开的对话框中，添加原始图像和鼠标经过图像分别是同一个按钮的两种不同的颜色，如下面的两个按钮图片：
- 15
依照上面的方法，制作其他的导航按钮，最后得到这个效果：当鼠标放到按钮上的时候，按钮就会变化一种颜色，至此，图片导航就只做完成了。