网页导航设计练习

练习一、

本例是通过图层样式、钢笔工具、矢量蒙版结合使用制作。其中图层样式用到“渐变叠加”“阴影”“斜面和浮雕”，在调节图层样式的参数时，只需微调。此处添加了两个圆矩形，一大一小，每个矩形都设置了图层样式，以使导航更有层次感和立体感。用钢笔工具绘制椭圆形，转换为选区，结合矢量蒙版（填充黑色），巧妙地制作出凹陷效果。

具体步骤参见：http://wenku.baidu.com/view/e31a998402d276a200292e2b.html

注意：1、在添加图层样式时，无需所有样式都要添加，少数几个也能调出理想效果，注意实践，观察细微变化。

         2、渐变工具拉出的颜色，是从前景色到背景色，注意设置好颜色即可（如此例背景），多加练习渐变工具的几种类型（“线性渐变”、“径向渐变”、“角度渐变”、“对称渐变”、“菱形渐变”）。

举一反三：

 

练习二、

本例亮点之处在于导航上竖纹的制作。主要步骤（详细参见http://www.missyuan.com/thread-372667-1-1.html）：

1、用圆矩形画出导航的背景，设置图层样式。

2、新建一个图层1，用缩放工具放大到1000%，用画笔在这个新建图层上画出一条适当长度的1px竖线，颜色为#ffffff；如下图：

3、为图层1添加渐变颜色，然后复制图层1为图层2，再为图层2添加渐变颜色。结果如下图：

4、缩放至100%，如下图，然后复制多个该图层，加文字即可完成。

 

总结：放大透明图层，利用1px，可以制作许多不错的效果，应多积累。