|
导读Adobe Photoshop，简称“PS”，是由Adobe Systems开发和发行的图像处理软件。Photoshop主要处理以像素所构成的数字图像。使用其众多的编修与绘图工具，可以有效地进行图片... Adobe Photoshop，简称“PS”，是由Adobe Systems开发和发行的图像处理软件。Photoshop主要处理以像素所构成的数字图像。使用其众多的编修与绘图工具，可以有效地进行图片编辑工作。ps有很多功能，在图像、图形、文字、视频、出版等各方面都有涉及。 网页设计在技术层面上，第一步是美工做出网页效果图，第二步就是网页前端进行网页切图。网页切图工具常用的有fireworks、PS，这里使用PS进行网页切图。我们通过设计稿，得到我们想要的产出物（如.png,.jpg文件），给网页提供图片素材（HTML:img，CSS:background）。 一.使用PS工具1.1 PS首选项设置编辑-》首选项-》单位与标尺，选改为像素。
1.2 面板在“窗口”菜单下开启：
关闭其他不需要的功能，将以上功能放置在合适的区域，窗口-》工作区-》保存工作区，设置后的工作区如下：
1.3 切图常用工具
1.4 辅助视图在“视图”菜单下开启：
二.获取信息打开设计稿，获取信息：
获取信息最重要的是将画布拉的尽量大，尽量减小误差。 测量2.1所有数字都要测量工具：
测量内容：
2.2测量选区（矩形选框工具）
2.3文字相关测量2.3.1单独的文字图层选中图层，点击工具T，顶部选项区显示如下：
可以直接获得文字的大小； 点击
2.3.2非单独的文字图层（选择较大字作为测量）使用矩形选框工具，选中文字，高度即为字号大小； 行高的测量 使用矩形选框工具，从上一行文字底部到本行文字底部的高度即为行高，如下图：
取色2.4所有颜色都要取色工具：
取色内容：
尽量放大画布，获取实点、避免锯齿点。 2.5单独的文字图层可以直接获取颜色，其他的颜色用“拾色器+吸管工具”获取
2.6取色工具的巧用2.6.1确定背景是否为纯色（拾色器+吸管工具）
2.6.2确定是否是线性渐变（魔术棒）
三.切片3.1 需要切片的内容修饰性的（一般用在background属性）：
内容性的（一般用在img标签）
例如，下图，红色框内是需要切的，黑框内是从后台获取的不需要切
3.2 切出来的图片的保存类型
其中PNG8和PNG24都支持全透明；PNG24支持半透明的（图片质量比较高），但ie6不支持PNG24半透明，需要做兼容。 3.3.切图隐藏文字只保留背景 3.3.1文字独立图层（隐藏文字图层）
3.3.2文字和图片合并（平铺背景覆盖文字）背景图可以做拉伸
背景图不可以做拉伸（背景有纹理效果等）
3.3.3 获取切片切图.PNG24
切图.PNG8（带背景切）
3.3.4 可平铺背景的切图
3.4.切片工具（适用于可以一刀切的活动页）
四、保存存储所需内容（背景一般为透明）
4.1 保存类型一（JPG）
注：品质：60-80；不能为100,80已经很好 4.2 保存类型二（PNG8）
注：保存时，需要重新设置无仿色和无杂边
4.3 保存类型三（PNG24）
默认设置。 4.4 保存类型四（PSD）
五 修改与维护随着项目的进展，我们可能想要改变图标的位置、添加新图标、删除旧的图标、修改画布的大小，所以要进行修改和维护。 5.1 更改画布大小5.1.1 增加画布图像-》画布大小，根据情况，选择定位点
5.1.2 减小画布
5.2 移动图标
注：若图标为非独立，可用选区工具选中图标区域，按Ctrl+X剪切，然后再粘贴，将此图标变为独立的图层。 5.3 添加图标将图标整理后，放入相应的位置即可。 注意事项：修改PNG8的图片，需要更改颜色模式为RGB颜色，操作方法：图像-》模式-》RGB颜色。 六 使用图片合并方案：Sprite 图片 CSS Sprites在国内很多人叫CSS精灵，是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去，这样一来，当访问该页面时，载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。根据具体图标在大图上的位置，给背景定位。 Sprite拼图好处：减少网络请求，提升网页加载速度。
6.1 大小与质量（平衡与取舍）
6.2 合并6.2.1 排列图片之间必须保留合适空隙，（便于图片修改、Css代码编写） 图标排列方式：横排和竖排
6.2.2 分类
6.2.3合并推荐
七 浏览器兼容方案7.1 IE6不支持PNG24半透明
7.2 Css3
7.3 优雅降级
更多页面制作部分之PS切图 相关文章请关注PHP中文网！ Photoshop默认保存的文件格式，可以保留所有有图层、色版、通道、蒙版、路径、未栅格化文字以及图层样式等。 |
温馨提示：喜欢本站的话，请收藏一下本站！
本站发布的Win7纯净版系统、Win10纯净版和XP纯净版系统仅为个人学习测试使用，请在下载后24小时内删除，不得用于任何商业用途，否则后果自负，请支持购买微软正版软件！
本站所有资源全部来自于网络资源,如侵犯到您的权益,请及时通知我们(peng896066052@126.com),我们会及时处理.
Copyright © 2018-2020 雨林木风下载站
，可以获得其他的一些信心，如行高：
