自由的控制视图系列
- 自由的浏览图片:按住空格后,鼠标拖动
- 自由的缩放图片:按住alt+滚轮
- 切换到实际像素(100%):Ctrl + 1
- 工作区类型切换:Tab
控制内容系列
- 通过画面上点选一个图层:Alt + 鼠标右键
- 在画面上拖动一个图层:V 切换到移动模式 鼠标拖动
- 复制拖动一个图层:移动模式下 Alt+拖动
- 删除一个图层:选中要删除的图层 按下 Delete
- 合并多个图层:选中要合并的图层 按下 Ctrl+E
- 选区内填充颜色:Alt+Delete (前景色) Ctrl+Delete(背景色)
- 缩放当前选择图层:Ctrl+T(自由变换模式)
实用工具系列
- 画一个选区:点击M进入选区模式 , 鼠标拖画
- 放弃选区:Ctrl+D 吸管工具:点击I进入吸管模式,点选画面颜色
- 文字工具:点击T进入文字模式,点选画面的文字或者创建新文本
- 切片工具:点击C进入切片模式(旧版本会有不同)
-
快速隐藏其他图层:alt+小眼睛
-
ctr+r标尺
切图之前的思路分析
拿PSD效果图后,首先应该对这张效果图进行分析,在切图层面上,主要分析三点哪些图片是单独的,比如Logo和banner部分
哪些图片是需要平铺的,比如导航部分的背景*
哪些图片是需要CSS sprite
比如一些列表前面的icon小图标
图片的格式
logo统一切成png透明度的(颜色较少的都用png)
看透明度情况使用png8或png24
一般情况下临时图
、ad
、banner
图用jpg格式,色彩丰富的、大图切成jpg
颜色较少的都用png,用png8还是png24需看图片具体透明底情况,半透明的切成png24
在保证图片的画质情况下,图片的大小越小越好
尺寸小的,色彩不丰富的和背景透明的切成gif或者png8的
(注:IE6不支持PNG24透明度图片,需做兼容处理或切成PNG8)
*【PNG-8和PNG-24的区别】png8有1位的布尔透明通道(要么完全透明,要么完全不透明),png24则有8位(256阶)的布尔透明通道(所谓半透明)**
png-8 和gif有一些相似之处,模式都是索引颜色,只支持像素级的纯透明,不支持 alpha 透明。
(注:我们通常说的“IE6不支持 PNG 透明”,是指不支持 PNG-24 的透明。但是 IE6 支持 PNG-8 的透明,就像支持gif的透明一样)
切图的一些小技巧
Ctrl+N
新建一个透明背景图层(大小识图层比例而定,比裁剪的图层大就行)
shift
+鼠标左键点击图层可选中多个图层进行操作
Ctrl
+鼠标左键选中需要裁剪的图层移至第1步中新建好的透明背景图层当中,再按ctrl+shift+E
进行合并可视图层。
Ctrl
+鼠标左键点击右边图层栏的选区视图,选中需要裁剪的图层选区,再按快捷键[Alt+I+R
(裁切)或Alt+I+P
(裁剪)]进行裁剪
裁剪完成后ctrl+shift+alt+s
进行保存为web可用格式。