手机
当前位置:查字典教程网 >ps >PS入门实例教程 >Photoshop设计欧美商务网页模板
Photoshop设计欧美商务网页模板
摘要:这样的布局可用于业务布局,企业网站,甚至是一个WordPress主题。先看看整体样式。开始,创建一个新的文档,将填充背景层颜色值:#ece5...

这样的布局可用于业务布局,企业网站,甚至是一个WordPress主题。

先看看整体样式。

Photoshop设计欧美商务网页模板1

开始,创建一个新的文档,将填充背景层颜色值:#ece5db。

Photoshop设计欧美商务网页模板2

1、在底部的布局,创建一个圆角矩形工具。设置前景色为:#f6f2ed。

Photoshop设计欧美商务网页模板3

2、为圆角矩形添加如下的图层样式。

Photoshop设计欧美商务网页模板4

3、继续使用矩形工具,在网页头部创建一个简单的矩形,填充颜色 #2d2b26。

Photoshop设计欧美商务网页模板5

4、复制网页头部的矩形,放在底部布局。 复制图层的快捷键 CTRL+J 。

Photoshop设计欧美商务网页模板6

5、请添加以下层样式。

Photoshop设计欧美商务网页模板7

6、在头部矩形下创建另一个形状。在这里以后放置logo。

Photoshop设计欧美商务网页模板8

7、也为这个形状添加一些简单的图层样式。

Photoshop设计欧美商务网页模板9

Photoshop设计欧美商务网页模板10

8、使用圆角矩形工具,创建一个形状。可以创建成一个幻灯片形式的banner。

Photoshop设计欧美商务网页模板11

9、加入banner图片, 建议使用唯美的图片。

Photoshop设计欧美商务网页模板12

10、加入文字导航。这里样式的是大字导航名称,下面辅助的解释说明信息文字。

Photoshop设计欧美商务网页模板13

11、为导航添加一些垂直的线。

Photoshop设计欧美商务网页模板14

12、放大导航区域,看清线条的处理。

Photoshop设计欧美商务网页模板15

13、加入Logo。

Photoshop设计欧美商务网页模板16

14、在logo区域的右侧,加入网页搜索框。

要创建这个需要使用圆角矩形工具。如果你看我前面的教程,会发现我已经使用这个搜索表单的图层

样式。

Photoshop设计欧美商务网页模板17

15、在这中间的布局我要添加一个图像和一些内容。

Photoshop设计欧美商务网页模板18

16、如下设置图层样式。

Photoshop设计欧美商务网页模板19

Photoshop设计欧美商务网页模板20

17、请查看下面的图片,是如何填补了网页主体的布局。

Photoshop设计欧美商务网页模板21

18、这是最终的结果。

Photoshop设计欧美商务网页模板22

        :更多精彩教程请关注三联photoshop教程栏目,三联PS群:182958314欢迎你的加入

【Photoshop设计欧美商务网页模板】相关文章:

Photoshop制作清爽有趣的水立方效果

photoshop cs5魔棒工具精确的完成复杂选择

Photoshop设计救身圈组成的软件APP图标

Photoshop设计漂亮的网页页脚模板

Photoshop男士产品商业修图教程

Photoshop使用笔刷设计出自己喜欢的形状

Photoshop怎样把做好的方框拉成别的形状

Photoshop打印时分辨率设多少

Photoshop安装guidegui辅助线扩展面板插件图文教程

Photoshop制作人物阿凡达效果

精品推荐
分类导航