空来风 发表于 2009-9-3 22:45:47

photoshop设计vista风格网页

http://pic.16xx8.com/allimg/090903/22421I351-0.gif
以下是详细的photoshop教程步骤:新建一个800*900,背景为#1e1e1e的文件。选择圆角矩形工具,在顶部拖出一个高约30px的黑色矩形框。并添加以下样式:
http://pic.16xx8.com/allimg/090903/22421IT0-1.jpghttp://pic.16xx8.com/allimg/090903/22421I164-2.jpghttp://pic.16xx8.com/allimg/090903/22421G313-3.jpghttp://pic.16xx8.com/allimg/090903/22421LQ5-4.jpghttp://pic.16xx8.com/allimg/090903/22421MJ2-5.jpg现在黑色圆角矩形条应该有点vista的意思了吧,选择自定义形状,添加网站首页图标,和站点地图图标。
http://pic.16xx8.com/allimg/090903/22421L0E-6.gif打开一张vista风格的壁纸,这里用vistagrass壁纸,(点着下载),调整、裁剪大小。
http://pic.16xx8.com/allimg/090903/22421M126-7.gif下面制作高光区,用钢笔工具做出下面选取:
http://pic.16xx8.com/allimg/090903/22421K110-8.jpg填充白色,并添加图层模板,梯度渐变。
http://pic.16xx8.com/allimg/090903/22421L404-9.gif添加网站标题和口号
http://pic.16xx8.com/allimg/090903/22421I1T-10.gif复制第一步里面的黑色矩形框,去掉内阴影效果,移动到绿色草地下面作为导航栏。并添加导航文字。
http://pic.16xx8.com/allimg/090903/22421G464-11.gif
http://pic.16xx8.com/allimg/090903/22421IR9-12.gif13 5下面制作,下面的内容板块。同样用圆角矩形工具,做出一个大小适当的,标题栏。添加如下样式:
http://pic.16xx8.com/allimg/090903/22421KZ8-13.jpghttp://pic.16xx8.com/allimg/090903/22421L548-14.jpghttp://pic.16xx8.com/allimg/090903/22421L606-15.jpghttp://pic.16xx8.com/allimg/090903/22421JF7-16.jpghttp://pic.16xx8.com/allimg/090903/22421G5I-17.jpg标题栏做好后,仍然是圆角矩型工具,在下面添加内容框。
http://pic.16xx8.com/allimg/090903/22421J4K-18.jpg最终得到页面:
http://pic.16xx8.com/allimg/090903/22421I351-0.gif
页: [1]
查看完整版本: photoshop设计vista风格网页