Photoshop在网页制作中应用

上传人:夏** 文档编号:578251698 上传时间:2024-08-23 格式:PPT 页数:12 大小:2.55MB
返回 下载 相关 举报
Photoshop在网页制作中应用_第1页
第1页 / 共12页
Photoshop在网页制作中应用_第2页
第2页 / 共12页
Photoshop在网页制作中应用_第3页
第3页 / 共12页
Photoshop在网页制作中应用_第4页
第4页 / 共12页
Photoshop在网页制作中应用_第5页
第5页 / 共12页
点击查看更多>>
资源描述

《Photoshop在网页制作中应用》由会员分享,可在线阅读,更多相关《Photoshop在网页制作中应用(12页珍藏版)》请在金锄头文库上搜索。

1、Photoshop的切片功能在网页制作中的应用网页中的元素有很多,像Banner条、文本框、文字、版权、Logo、广告等。尽量把这些相对独立的元素放在不同的图层中,这样方便以后的再编辑。图层多时,可建立多个图层组来进行管理。单击图层面板右上角的小三角按钮,从弹出菜单中选择”新建组”,在随后出现的对话框中为新建组取一个名称,确定即可。建组名称依据可依照css对版块的布局名称来命名。如头部文件可建立立一个header组,在header中建立bannerlogo等常用的组。点击图层组前面的小三角,就可以像文件夹一样展开或折叠它。对同一组中的所以图层可以方便地进行统一操作,如整体移动,复制、删除、隐藏

2、、合并等。一、用Photoshop制作网页模板切片如果要合并而且不影响以后修改,可以尝试盖印图层。具体操作时在所有图层上面新建空白图层,然后使用快捷键+盖印可见图层到新建的图层。如果你想借鉴某个网页的设计,不妨把它截成图片放在最下面的图层中,再拉出多个参考线划出网页的大致版式,再在此基础之上边参考边制作自己的网页。小提示:1、 使用切片是最直白的网页布局方法。不要再想如何去设计表格,也不要想什么DIV,你首先要想的是你的网页要做成什么样子?把你所想的画画出来就行了!2、 使用切片可以有效地减小页面文件的大小,提高浏览者浏览页面的体验。想想看是把一个图片完整下载下来快,还是把一个图片分成若干个小

3、图同时下载快呢? 二、为什么要使用切片?1、 打开你设计好的PS图,选择切片工具 三、如何切片?2、 按网页的结构和图片的特点进行切片 切片的大小和位置可以通过切片选项来进行调整 3、 选择文件菜单 另存为WEB格式命令,保存时会生成index.html 图片文件会存放在images文件夹中(CS3要选择存储为html和图片) 4、使用Dreamweaver软件打开刚刚保存生成的html文件进行编辑,删除不必须的图片和进行内容的填充。1、切片是生成表格的依据,切片的过程要先总体后局部,即切片是生成表格的依据,切片的过程要先总体后局部,即先把网页整体切分成几个大部分,再细切其中的小部分。先把网页

4、整体切分成几个大部分,再细切其中的小部分。 2、 对于渐变的效果或圆角等图片特殊效果,需要在页面中对于渐变的效果或圆角等图片特殊效果,需要在页面中表现出来的,要单独切出来表现出来的,要单独切出来 3、 在在DW中进行编辑时,少用图片,如果能用背景颜色代替中进行编辑时,少用图片,如果能用背景颜色代替的就使用背景颜色,的就使用背景颜色, 能使用图案的也尽可能使用图案平铺来能使用图案的也尽可能使用图案平铺来形成背景形成背景 四、切片原则1 1、在、在photoshopphotoshop中设计网页大小如何确定?中设计网页大小如何确定? 800*600800*600我一般宽会设成我一般宽会设成780px

5、780px,1024*7681024*768宽度会设成宽度会设成1000px1000px,高度当然要看内容多少来定。布局就不好说了要看,高度当然要看内容多少来定。布局就不好说了要看设计者的喜好、习惯、网站的功能、设计风格来定了。设计者的喜好、习惯、网站的功能、设计风格来定了。2、在、在dreamweaver中如何看到从中如何看到从photoshop中到导出的网页中到导出的网页是如何布局的?是如何布局的? 从从Photoshop中导出的页面已经自动用表格划分好了,你可中导出的页面已经自动用表格划分好了,你可以在屏幕上方的工具栏选择到布局一项,之后在右边选择扩以在屏幕上方的工具栏选择到布局一项,之后在右边选择扩展模式,这样就能看见表格了。展模式,这样就能看见表格了。五、常见问题3、 在在DW中进行编辑时,删除图片时出现表格错位中进行编辑时,删除图片时出现表格错位如何办?如何办? 删除图片的时候记住图片的长宽,再插入一个相同删除图片的时候记住图片的长宽,再插入一个相同长宽的表格。长宽的表格。 4、 在在DW中如何自定义表格的长宽?中如何自定义表格的长宽? 使用表格长宽一样的图片做为单元格的背景。使用表格长宽一样的图片做为单元格的背景。 5、 如何在图片上输入文字?如何在图片上输入文字? 把图片设置成背景。把图片设置成背景。

展开阅读全文
相关资源
正为您匹配相似的精品文档
相关搜索

最新文档


当前位置:首页 > 资格认证/考试 > 自考

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号