前端应该会的基础PS技术

一.前端与设计师协作，根据设计稿将需要的背景图分离出来，用HTML与CSS完成页面的制作。

 

二.PSD与JPG的区别：PSD由多个图层组成，JPG只有一个图层。

 

三、数据图和背景图区别

      数据类：-后台传到页面的图

                    -可以用几张图进行替代，而不是全部都需要进行切图

      背景图：-背景图片

                    -如小图标

                    -切图的主要工作

      分类依据：图像是不是数据，是不是后台可以进行更换

 

四、前端处理PSD图片的步骤

     选择要切得图层->新建文件用于存储->移动图层->裁剪->存储

 

五、选择图层的方法：

1.自动选择

2.alt+鼠标右键

3.alt+shift+鼠标右键 选择多个图层（自动选择须去掉）。

 

六.网页图片常见的格式有：

JPG，GIF，png-8，png-24

四者间差别

1.透明

除了JPG以外，其他格式是支持全透明的，只有png-24支持半透明

2.浏览器

gif，png-8，png-24在不同的浏览器有不同的兼容性问题，优先选取png-24

3.大小（质量）

png-24>jpg>png-8>gif

4.动画

只有gif支持动画

---

快捷键：

选择图层： alt+鼠标右键

选择多个图层（自动选择须去掉）: alt+shift+鼠标右键

图层删除： delete

复制图层： ctrl+J

合并图层： ctrl+E

撤销一次： ctrl+Z

撤销多次： ctrl+alt+Z

选取工具： M

移动工具： V

取消选区： ctrl+D

新建文件： ctrl+N

打开：ctrl+O

关闭：ctrl+w

标尺：ctrl+R

显示/隐藏参考线：ctrl+H

撤销/还原：ctrl+z

撤销多次：ctrl+shift+Z

复制：ctrl+c

粘贴：ctrl+V

剪切：ctrl+X

反向选择选区：ctrl+shift+I

放大（3022%）：ctrl+''+'

缩小（0.21%）：ctrl+"-"

最佳视图：ctrl+0

背景色填充：ctrl+delete

前景色填充：alt+delete

编组（在选中多个图层的情况下）：ctrl+G

取消编组：ctrl+shift+G

存储为web格式：ctl+shift+alt+S

变换（可以进行图层的缩放、扭曲等）：ctrl+T