利用PhotoShop制作音乐网站导航栏

查查

<TABLE cellSpacing=4 cellPadding=4 width=400 align=center border=0>
<TBODY>
<TR>
<TD vAlign=top height=23>
<P align=justify><FONT face="Arial, Helvetica, sans-serif" size=2>创建新画布，使用圆角矩形工具创建圆角矩形。 </FONT></P></TD></TR>
<TR>
<TD vAlign=top height=30>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=143 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132134458.jpg" width=380></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>插入吉他图片，并将其放置在画布右侧。</FONT></TD></TR>
<TR>
<TD vAlign=top height=96>
<DIV align=center>
<P><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=143 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132140398.jpg" width=380></FONT></P></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>复制吉他所在图层，自由变化（Ctrl+T），垂直方向压缩复制层，并在复制层中填充黑色。</FONT></TD></TR>
<TR>
<TD vAlign=top height=72>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=143 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132141662.jpg" width=380></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=38><FONT face="Arial, Helvetica, sans-serif" size=2>降低不透明度，完成投影制作。</FONT></TD></TR>
<TR>
<TD vAlign=top height=72>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=143 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132152120.jpg" width=380></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>使用钢笔工具绘制波浪形路径。</FONT></TD></TR>
<TR>
<TD vAlign=top height=72>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=143 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132153593.jpg" width=380></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=38><FONT face="Arial, Helvetica, sans-serif" size=2>创建新的图层，并使用椭圆工具在该层创建一个圆。</FONT></TD></TR>
<TR>
<TD vAlign=top height=72>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=143 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132156389.jpg" width=380 border=0></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>双击圆所在图层，打开图层样式窗口。<BR>渐变叠加：</FONT></TD></TR>
<TR>
<TD vAlign=top height=88>
<P align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=359 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132157642.jpg" width=377></FONT></P>
<P align=left><FONT face=Arial size=2>投影：<BR>混合模式“正片叠底”。</FONT></P></TD></TR>
<TR>
<TD vAlign=top height=121>
<P align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=359 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132202876.jpg" width=377></FONT></P></TD></TR>
<TR>
<TD vAlign=top height=24>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=230 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132204540.jpg" width=305></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=38><FONT face="Arial, Helvetica, sans-serif" size=2>按下Ctrl并点击圆形所在图层获得选区。</FONT></TD></TR>
<TR>
<TD vAlign=top height=95>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=230 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132205831.jpg" width=305></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>选择 &gt;&gt; 修改 &gt;&gt; 收缩。</FONT></TD></TR>
<TR>
<TD vAlign=top height=130>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=95 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132205209.jpg" width=256></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=232 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132207557.jpg" width=262></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>创建新的图层，填充黑白渐变效果。</FONT></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center>
<P><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=141 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132208640.jpg" width=146></FONT></P>
<P>&nbsp;</P></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>选择选取工具向上移动选区。</FONT></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=141 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132208626.jpg" width=146></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>反选（Ctrl+Shift+I）并删除，改变图层模式为滤色。 </FONT></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center>
<P><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=236 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132208393.jpg" width=213></FONT></P>
<P>&nbsp;</P></DIV></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=223 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132209709.jpg" width=191></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>同样的方法制作出按钮下方的高光效果。</FONT></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=223 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132210853.jpg" width=191></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>利用椭圆工具创建圆，自由变换（Ctrl+T），调整适当的位置和不透明度，完成按钮投影的制作。</FONT></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=239 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132210703.jpg" width=146></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>复制出其它按钮。</FONT></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=146 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132210959.jpg" width=380></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>添加搜索栏。</FONT></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=252 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132211931.jpg" width=237></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>输入按钮文字。</FONT></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=237 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132212944.jpg" width=106></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=40><FONT face="Arial, Helvetica, sans-serif" size=2>为文字添加外发光效果。<BR>图层 &gt;&gt; 图层样式 &gt;&gt; 外发光。<BR>混合模式：滤色。<BR>颜色：白色。</FONT></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=342 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132215298.jpg" width=375></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=229 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132231273.jpg" width=114></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=146 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132231616.jpg" width=380></FONT></DIV></TD></TR>
<TR>
<TD vAlign=top height=24><FONT face="Arial, Helvetica, sans-serif" size=2>插入网站名称和LOGO，大功告成<IMG src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132232773.gif">。</FONT></TD></TR>
<TR>
<TD vAlign=top height=88>
<DIV align=center><FONT face="Arial, Helvetica, sans-serif" size=2><IMG height=146 src="http://www.cgfancy.com/Article/UploadFiles/200604/20060419132239122.jpg" width=380></FONT></DIV></TD></TR></TBODY></TABLE><BR><script language="JavaScript" src="http://www.16xx8.com/bbs/10.js"></script><BR>

天际

不错，很不错，谢谢楼主的分享！！！