PS基础使用方法-前端切图部分

<h2 id="ps-">PSD文件和非PSD文件的区别</h2>
psd文件为带有图层的文件,非PSD(jpg,png,gif)文件为没有图层的文件
<h2 id="ps-">PS图层的设置</h2>
对于前端来讲我们对于面板的设置一般为排版规则的选项
<ul>

<li>设置方法
mark
</li>
<li>打开信息面板,修改单位
mark

<h2 id="-">打开文件</h2>
文件=>打开
<h2 id="-">标尺、辅助线工具</h2>

</li>
<li>标尺设置 视图 => 标尺</li>
<li>清除 辅助线 视图 => 清除参考线</li>
</ul>
<h2 id="-">矩形选框工具 拾取颜色 缩放工具</h2>
在 最左侧的工具栏里选取 快捷键依次是 M I Z
<h2 id="-">抓手工具</h2>

快捷键是H 但是我们通常使用的时候呢,是站住空格键加鼠标左键就能移动图片 当我们选取抓手工具的时候(此时已经按了H),我们左上方会有四个按钮
mark
第一个按钮实际像素 就是能显示出图片图片实际的大小 第二个按钮适合屏幕 就是能显示出图片在你PS工具上都能显示的合适大小 这两个是我们在开发中常用的两个按钮
<h2 id="-">移动工具(自动选择)</h2>
快捷键是V 当在图片上点击每一块区域时就能选中和移动这个图层。
<blockquote>注意:我们开发中会勾选自动选择
mark
</blockquote>
<h2 id="-">切图及切图时图层注意事项</h2>
<ol>
<li>V 选择你要的图层</li>
<li>M 选取你要选取的范围</li>
<li>ctrl+c 复制</li>
<li>ctrl+n 新建一个文件</li>
<li>ctl+v 粘贴在这个文件上</li>
<li>文件 储存为WEB所用格式 格式一般为 png jpg gif ,当你的背景为透明一定要选png24,存储,选择存储目录,确定(推荐) (第二种方法 选择目录 格式一般为 png jpg gif 确定 )</li>

</ol>
<h2>以下是参考实例</h2>
1、打开文件

把图片拖拽到ps里 或者 文件--打开--找到这个文件--打开
2、修改单位
ctrl+k---单位与标尺---标尺 改为像素
3、放大镜 z 鼠标左键拖拽图片
4、移动工具v
放大 ctrl+"+"
缩小 ctrl+"-"
5、显示/隐藏 标尺 ctrl+r
6、显示/隐藏 辅助线 ctrl+;
7、矩形选框工具 M 测量大小
8、小手状态,拖拽图片: 按住空格+鼠标左键 拖拽
快捷键 H
9、还原图片大小 ctrl+1
10、图片适应窗口的大小 ctrl+0
11、吸管工具 i

切图:
1、切片工具 c
或者:左边工具栏 第五个选中点击右键 选中第三个 切片工具
2、保存切片
ctrl+alt+shift+s
3、选中所有的切片 预设:JPEG高 ----存储---文件名:img 选择:所有用户切片---保存
<h3>雪碧图精灵图制作</h3>
1 css精灵 雪碧图:
把多张图片放在一张图片中加载
好处:减少http的请求次数

2、制作雪碧图
新建一个psd ctrl+N 宽度200px 高度 100px 背景内容:透明
在原图上M 选择图标部分 ctrl+c
在新建的图像中ctrl+v

移动工具 : 勾选自动选择 选择图层

M键小图标--》选择--》色彩范围 出现吸管工具 吸取白色的部分,---》按Delete键
ctrl+d 取消选区
v键 可以移动

推荐阅读更多精彩内容