切图

切图

一、 设置默认选项（保存工作区）

1.编辑菜单-首选项-单位与标尺-标尺&文字的单位：像素(px)
2.窗口菜单-打开面板（其它关掉）：图层、信息、历史记录、选项、工具
3.视图菜单-打开功能：对齐（吸附效果）、标尺、显示额外内容、显示-参考线（从标尺拖出）

二、 工具（选项）面板

1.移动：勾选“自动选择”，下拉列表选择“图层”
2.魔棒：容差-越小越精确

三、 设计稿信息

1.尺寸信息：文字大小、行高：

单独文字图层：选择文字工具（工具面板）-选择文字-查看选项面板（行高需点出右侧小文件夹按钮）
合并背景图层：矩形框工具手测（不同字体有误差，尽量选择稍大的字），行高-第一行字下~第二行字下

2.颜色信息：字体取色与字体尺寸获取相似（单独&合并），有叠加效果的不可看字体信息，应用取色器

四、 快捷键

1.撤销多步：ctrl+alt+z
2.缩放：ctrl+1(100%) / alt+滚轮 / ctrl+”-“”+”
3.添加到选区：shift / 从选区减去：alt / 与选区交叉：shift+alt（两边各选一点选区相加，可测量两点之间距离（含））
4.新建：ctrl+n
5.存储为WEB格式：alt+shift+ctrl+s（背景内容要选透明）

五、 切图

1.带文字的，隐藏文字只留背景（除非文字有特效）

单独文字图层：隐藏文字图层
合并背景图层：
-可拉伸：矩形选框选一部分背景，按crtl+t自由变换，往右拉隐藏文字，后双击。
-不可拉伸（有纹理）：矩形选框选一部分背景，按alt往右逐步盖住文字。（按shift可保持水平稳定移动）

2.单个图层：移动工具选择 / 多个图层：图层面板中ctrl选择，ctrl+e合并
3.切片：拉参考线-切片工具（裁剪下）-选项栏“基于参考线切片”

六、 图片类型

1.JPG：色彩丰富，无透明效果（品质60~80即可）
2.PNG8：色彩不太丰富，无论有无透明效果？（256色，扩散改为无仿色，无杂边，可存储预设）
3.PNG24：半透明效果（阴影），IE6不支持PNG24半透明
4.PSD：为保证图片质量、图层，保留一份PSD，要修图的在PSD修改后导出

七、 修改与维护

1.修改PNG8图片时，须设图像菜单-模式-索引颜色改为RGB颜色（否则颜色值不正确）
2.更改画布大小：图像菜单-画布大小-定位改为左上角（CSS定位属性可不用更改）

八、 图片合并

CSS-sprite