WEB前端之学会用PS很重要

你说有美图秀秀之后PS要over了，NO PS 依旧很重要，当然除了修人像，比如切图什么的

来吧开始吧在开始切图之前，先科普几个小技巧

1. 如果快速从大图中拿出自己想要的小图

需求：快速拿出上面红色框中的小图

实现方式：在工具箱找到选择，然后选中你需要的图后 ctrl + C 复制下然后 ctrl + N 最后Ctrl+V 保存即可

2. 布局需要量取尺寸怎么看？

实现方式：选择工具选中你要的区域后，F8 可以看到信息面板上面有 w 和 H 直接在html上使用

3. 吸个颜色怎么弄？

实现方式：在工具箱中找到拾色器，在需要吸取颜色的区域点击，最后复制#后面的色值即可

-------------------------------------来个华丽的分割线-----------------------------------------

给你一个真实的.psd 源文件的图片你要怎么一步一步切图出来？

第一步：将PSD文件在PS中打开

第二步：在工具箱中找到切片工具切图

第三步：通过切片工具选出你要切图的区域后保存

选一个保存后的图片格式（格式有什么区别呢）

jpg使用的一种失真压缩标准方法，不支持动画、不支持透明色。JPEG的压缩方式通常是破坏性资料压缩（lossy compression）,意即在压缩过程中图像的品质会遭受到可见的破坏。一张图片多次上传下载后，图片逐渐会失真。

png8和png24格式如何选择

1、如果对图片占用空间大小有要求，那么可以选择png8的格式，因为这个压缩比高会比png24格式占用更少的空间
2、在ie6浏览器下是不支持png24格式透明的，只支持png8和gif透明。
3、如果应用在app建议使用png24格式保存，因为这样图片会更清晰，质量会更高
4、色彩丰富的、大的图使用jpg格式，不要使用png格式
5、尺寸小的，色彩不丰富的和背景透明的切成gif或者png8的，色彩丰富的则需要用png24格式

SO ，还有一个问题，切图OK 了，那么小图标怎么办，不能连着白色背景一起切吧？

实现方式：首先在PS右侧的图层中找到小图标

在图层上点击右键复制图层，弹出提示框内，目标位置选择新建

保存后，可以得到小图标单独图层，通过切片工具切图保存

最终得到png格式的小图标了

最后，总结一下

身为一名前端工程师使用PS无非就是在切图和去切图的路上，所以对PS并不需要UI设计师一样对PS了解的那么透彻，只要会用切图和简单的操作，你就完成了前端的标配了

WEB前端之学会用PS很重要相关推荐

Web前端工程师必备的PS技能之切图
1. PS中我的标尺的参考线为什么不能自动吸附图层或画布中间了?有个选项没有选择"菜单栏-视图-对齐",勾选下,里面的选项你可以看着勾选.还有一点要注意,你想吸附到图 ...
个人Web前端开发切图PS设置
(一) 文件新建设置画布大小 Web(1920×2000) 像素分辨率(R) 72 像素/英寸颜色模式 RGB 8位背景内容(透明) (二) 移动工具设置自动选择不要勾选,右边选择图层需要 ...
web前端学习155（ps基本操作---选区，取色）
文章目录 2. PS基本操作 2. PS基本操作因为网页美工大部分效果图都是利用PS ( Photoshop )来做的,所以以后我们大部分切图工作都是在PS里面完成. 文件->打开:可以打开我 ...
一个合格的web前端程序员要学会哪些技能？
想要成为一名合格的web前端程序猿,要学习的东西有很多,那么web前端要学会哪些技能呢?来看看下面的详细介绍就知道了. 一个合格的web前端程序员要学会哪些技能?想从事web前端开发,只会HTML.C ...
零基础怎么学习web前端开发
零基础怎么学习web前端开发?web前端在移动互联网行业的运用是非常广泛的,而且web前端开发技术所涵盖的知识有很多,具体要怎么学习,来看看小编下面的详细介绍吧. 零基础怎么学习web前端开发?对零基 ...
web前端到底是什么？有前途吗
web前端到底是什么? 某货: "前几年前端开发人员鱼目混杂,技术参差不齐,相对学习起来不规范,导致> 前端开发人员聚集,所以现在前端工种和工资还是没得到普遍重视,但近2年来,> ...
零基础转行web前端，如何高效的去学习web前端?
web前端开发要学的知识内容涉及的会很宽泛,虽然说主要是html.css和JavaScript这些基础知识点,但学前端开发除了要学这些基础知识外,学员还要在这之上进行延伸和深入的去学,而且互联网时代不 ...
0基础学习前端开发，高职web前端开发技能大赛
零基础学web前端开发要怎么去学? 首先要学习的就是基础知识:html.css和JavaScript.HTML是内容,CSS是表现,JavaScript是行为.前端开发的门槛其实非常低,与服务器端语言 ...
web前端开发工程师是做什么工作的？
web前端开发工程师是做什么工作的? Web前端开发工程师是一个很新的职业,在国内乃至国际上真正开始受到重视的时间不超过10年.Web前端开发是从网页制作演变而来的,名称上有很明显的时代特征.在互联网 ...
web前端培训课程有哪些？
web前端培训课程有哪些?网站浏览现在已经成为人们了解各方信息的主要方式.其实之前IT技术只有美工和程序,随着技术进步,人们的生活需求转变,才逐渐衍生出web前端开发的岗位.近几年伴随这移动端用户逐渐 ...

WEB前端之学会用PS很重要

WEB前端之学会用PS很重要相关推荐

最新文章

热门文章