本篇教程是教大家如何用photoshop制作出如下的3D效果很强的三D效果导航条动态按纽。

查查

<P></P>
<P><FONT color=#660000 size=3><IMG height=40 src="http://design.emato.com/2/063216394991483.gif" width=96 border=0 name=Image2><IMG height=40 src="http://design.emato.com/2/063216394984842.gif" width=43 border=0 name=Image1><IMG height=40 src="http://design.emato.com/2/063216394967670.gif" width=77 border=0 name=Image3><IMG height=40 src="http://design.emato.com/2/06321639492582.gif" width=40 border=0 name=Image4><IMG height=40 src="http://design.emato.com/2/063216394988392.gif" width=47 border=0 name=Image5><IMG height=40 src="http://design.emato.com/2/063216394999509.gif" width=36 border=0 name=Image6><IMG height=40 src="http://design.emato.com/2/063216394932029.gif" width=94 border=0 name=Image7></FONT></P>
<P>1.新建一个 600X70 pixel 的文件。新建一个图层，在新图层上做出如下的图形。</P>
<P><IMG height=70 src="http://design.emato.com/2/063216394941288.gif" width=454><BR>2.按住ctrl,用鼠标点击新建的图层.这时你可以看到刚才做的也就是如上的黑色区<BR>域外出现了流通动的虚线。 这是表示该层的非空区域被选定了。 </P>
<P>3.选取前景色为一较浅色。我选的是稍浅的绿色。背景色设为深色，我用的是黑色。</P>
<P>4.在工具栏上选取渐变工具<IMG height=21 src="http://design.emato.com/2/063216394999509.gif" width=24>,将其选项设为from foreground to background（从前景色到背景色)。</P>
<P>5.从选区的顶部向选区的底部拉出一条渐变。</P>
<P>6.新建一个图层。</P>
<P>7.在菜单上操作：seclect(选择)$#@62;modify(修改)$#@62;contact(收缩)$#@62;填入 5 .</P>
<P>8.从收缩后的选区的底部向选区的顶部拉一条渐变。</P>
<P>9.再新建一个层,在菜单上操作：seclect(选择)$#@62;modify(修改)$#@62;contact(收缩)$#@62;填入 3</P>
<P>10..从收缩后的选区的顶部向选区的底部拉一条渐变。</P>
<P>11.在菜单上操作：layer(图层)$#@62;effect(效果)$#@62;投影,然后在弹出的对话框中点击ok(确定)。<BR>这时你的图形应该是像下图这样的。</P>
<P><IMG height=70 src="http://design.emato.com/2/063216394965976.jpg" width=454></P>
<P>12.现在我们为按纽加上我们的导航文字。在这之前先将前景色设为白色。<BR>然后点击<IMG height=20 src="http://design.emato.com/2/063216395047143.gif" width=25>进入文字的输入状态。最好将所有的文字一次性写上，这样可以省去很多工作。</P>
<P>13.在菜单上操作：layer(图层)$#@62;effect(效果)$#@62;shadow(投影)$#@62;next(点击按纽下一步)$#@62;在“apply(应用)”前打上勾。</P>
<P>然 咛迳柚茫航玸tyle(样式)设为:embass(浮雕效果)</P>
<P>depth(深度):3 ; blur(模糊)：1;</P>
<P>调整highlight(高亮)的选项：</P>
<P>model(模式)设为：color burn（颜色加深）；opacity(不透明度)：100%</P>
<P>调整shadow选项：</P>
<P>model(模式)：darken(变暗)；opcity(不透明度)：100%</P>
<P>然后点击ok(好)。这时应该是下图的效果。</P>
<P><IMG height=70 src="http://design.emato.com/2/063216395048565.jpg" width=454></P>
<P>14.菜单操作：view(视图)$#@62;ruler(显示标尺)</P>
<P>15.这时你将鼠标移到标尺上按住左键然后向图像拖去，会发现能托出一条蓝线。<BR>这不是真正的实线，而只是辅助线，所以你不必担心它影响了你的图像。</P>
<P>16.从上到下，从左到右，拉出如下的辅助线，来将这个按纽栏分成各个单个的按纽。 </P>
<P><IMG height=72 src="http://design.emato.com/2/063216395177507.jpg" width=454></P>
<P></P>
<P><IMG height=236 src="http://design.emato.com/2/063216395165088.jpg" width=210></P>
<P>17.在菜单上操作：layer(图层)，flatten(合并图层).</P>
<P>18.用<IMG height=20 src="http://design.emato.com/2/063216395163030.gif" width=24>选中"photoshop"的这一块，如下图。</P>
<P><IMG height=57 src="http://design.emato.com/2/063216395276720.gif" width=112></P>
<P>19.按ctrl+c复制，然后ctrl+n新建一个文件，再按ctrl+v粘贴。<BR>接下来你可以重复这个步骤，将这个按纽依次分块，保存为单个的按纽图形。</P>
<P>20.上面这步骤完成了按纽的普通状态的图像制作。接下来继续完成当鼠标移到按纽上后按纽的陷入图形的制作。</P>
<P>21.点击history(历史记录)面板，将操作回到flatten(合并图层)前一步的状态。</P>
<P>22.点击图层面板，这时的面板应该是如下的。</P>
<P><IMG height=236 src="http://design.emato.com/2/063216395165088.jpg" width=210></P>
<P>23.用右键点击最上面的一层，在弹出的菜单里选effect(效果)。</P>
<P>这时我们要改变它的图层效果：</P>
<P>将shadow(投影)这一项的apply(应用)前的勾去掉。</P>
<P>而embass(浮雕效果)的值则是改变一些：</P>
<P>depth(深度):2 ; blur(模糊)：1;</P>
<P>将角度改为“-120”</P>
<P>然后点击ok(好)。这时就做好原来的文字层的效果变成了下陷。</P>
<P>24.在菜单上操作：layer(图层)，flatten(合并图层).</P>
<P>25.然后用步骤18,19的方法再将图像分开保存成几个按纽的图像。</P>
<P>26.如果你dreamweaver用得比较熟，再接下来的工作就很简单了。</P>
<P>27.只要插入Rolloverimage,就可以将刚才的那些分割后的图形插</P>
<BR><script language="JavaScript" src="http://www.16xx8.com/bbs/10.js"></script><BR>