繁體中文当前位置: 首页 > 图文教程 > 平面设计 > Photoshop > PS教程:绘制清新的色彩生动的网页布局(3)
- Photoshop
- Photoshop 打造一张秋意浓浓插画
- Photoshop 偏色的人物照片快速修复及美化
- Photoshop 外景人物流行的橙红色调色教程
- photoshop 超强鼠绘逼真的樱桃
- Photoshop 颓废的红色立体字制作
- Photoshop 给照片加上云彩的方法
- Photoshop 美女时尚的淡黄中性肤色
- Photoshop 一台复古的黑白电视机
- photoshop 合成被魔法师冰封的恐怖恶魔
- Photoshop 真人转成石像快速方法
- Photoshop 人物照片粉嫩的淡青色
- Photoshop 实现的漂亮的潮流圆圈壁纸
- photoshop 个性的有文字背景的图形
- photoshop 迷人光线环绕的动感男生街舞海报
- Photoshop 照片的亮度及清晰度加强方法
- Photoshop 超经典的雪域天使
- Photoshop 可爱的馒头表情
- Photoshop 调出偏色照片流行的淡红色
- Photoshop 非常漂亮的3D小屋
- Photoshop 淡绿色的古典婚片处理方法
Photoshop 中的 PS教程:绘制清新的色彩生动的网页布局(3)
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2010-01-10 浏览: 42 ::
收藏到网摘: n/a
参考上一篇：
最终效果图：
第二十一步：新建蓝色矩形
- 在组“导航”下新建组（图层>新建>组），组命名为“案例”，再新建组放置在“案例”中，并命名为“背景”
- 选取矩形工具（U），颜色设置为#219aad，创建宽度为983px，高度为273px的蓝色矩形，（提示：打开(按 F8)信息面板，查看宽度和高度），设置此图层的透明度为55%，命名为“bg4”
3. 在photoshop中打开在上篇中一开始要保存的第二张图片“像素化的蓝色矩形”，把图片移动到此文档中，并且覆盖蓝色 矩形，同样也设置透明度为55%，命名为“bg3”.
4. 按住ctrl键，点击“bg4”中的矢量蒙版缩略图以选中此蒙版
5. 新建图层，放在“bg3”上方，命名为“bg2”，选取渐变工具（G），画一个颜色#56b8e5到透明的渐变，方向是从选区底部到选区头部，然后按ctrl+d撤消选区
6、新建图层，放在图层“bg2”上方，命名为“bg1”，选取矩形选框工具（M），像下图一样创建选区，宽度为983px，高度43px
7、选取渐变工具（G），画一个颜色#0f2b42到颜色#2a607f的渐变，方向是从选区底部到选区头部，然后按ctrl+d撤消选区
第二十二步：“注册”与“了解更多”
- 新建组“注册按钮”，放在组“背景”上方，选取圆角矩形工具（U），设置半径2px，像下图一样新建圆角矩形（82*38），并设置如下图一样的图层样式（注意：shap2图层的透明度是100%）
2. 重复步驟1，创建“了解更多”的按鈕，并且增加一层，添加箭头，选取自定义形状工具（U）中的第二个箭头形状，像下图一样创建箭头
第二十三步：
1. 新建组，命名为“左箭头”，放在组“了解更多按钮” 上方，选取椭圆工具（U），新建颜色为#406F94的圆，并设置“内阴影”和“描边”的图层样式
2. 新建图层，选取自定义工具（U）中的箭头形状，创建白色箭头，并设置图层样式“阴影”，透明度为50%
3. 重复步骤2，在右边也创建同样的箭头
第二十四步：
1. 在组“案例”中新建组，命名为“图片”，在组里放置一张小图片，双击图层，设置如下图的图层样式“外发光”
2. 新建组，选取字体工具（T），在蓝色矩形左边添加文字说明（这个得自己发挥了），组命名为“文字”。
第二十五步：创建内容区
1. 新建组，放在组“案例”下面，命名为“内容”，在此组里再新建一组“阴影”，选取矩形工具（U），创建一白色矩形（983*181），图层命名为“白色形状”，透明度为90%。
2. 像二十一步中的第4点一样，选中“白色形状”的图层蒙版，然后新建图层，命名为“头部阴影”，选取渐变工具（G），画一个颜色为#8f8f8f到透明的渐变，方向为选区的头部到选区的底部，设置图层透明度为50%，然后选取移动工具（V），按键盘上的向下的方向键两次。
3. 新建图层，选取矩形选框工具（M）像下图一样新建选区（273*180）。选取渐变工具（G）画一个颜色#8f8f8f到透明的渐变，然后取消选区，以下图为参考。
4. 添加图层蒙版（图层>图层蒙版>显示全部），使用大一点的黑色软笔刷（我用的是27px），涂在阴影中间部分上面，设置图层透明度为30%，命名为“垂直阴影1”，复制（ctrl+j）图层“垂直阴影1”，移动至右边，重命名为“垂直阴影2”。
5. 选取线条工具（U），新建重1px，颜色为#aebcc7的水平线，将图层转换为智能对象（右击图层，在下拉菜单中选择“转换为智能对象”）图层命名为“水平线”。
6. 选取字体工具（T），编辑网站内容，您也可以使用图片或别的来替换
第二十六步：创建网站底部内容
1. 新建组“底部”，并新建图层，选取矩形选框工具（M），新建选区（982*88）。
2. 设置前景色为#555555，选择一大的软笔刷（我选的是100px），沿着选区头部边缘进行涂画，撤消选区，设置图层透明度为50%，并命名为“渐变”。
最终的“渐变”将是这个样子：
3. 新建图层，选择单行选框工具，新建一选区，并以白色填充。按ctrl+d撤消选区。转到菜单 图层>图层蒙版>显示所有，选取一大点的黑色软笔刷像下图一样遮住图层，以下图为参考。设置图层透明度为15%，命名为“直线”。
4. 添加底部文字说明。
这个大制作终于完功了，里面的字体设置什么的还需要各位看客们多担待！最终效果图：
评论 (0) All
