https://blog.csdn.net/OBKoro1/article/details/69817571

1.下载

我现在使用的版本号:PS-CS6,网上很多破解版本的自行搜索下载。

2.安装好PS之后,先要调整工作区域的布局。

1.选择“窗口”——把“信息”,“图层”,“历史记录”,“颜色”面板打开,其他的可以先关闭了,在切图的工作中其他的基本用不到,这个很简单的,打几个勾就可以了,如下图所示:

Paste_Image.png

工作区的内容

2.调整好面板之后,选择“窗口”——“工作区”——“新建工作区”,将当前的工作布局保存起来,并命个名,之后下次打开的时候就会直接出现你调整好的工作布局,否则的话你每次重新打开ps的时候都要重新设置。

ps:就算有别人弄乱了你的面板也可以直接通过“窗口”——“工作区”——选择你之前保存的工作布局。

3.切图

切图需求:

这是我们需要切的图

切图步骤见图

切图步骤1.

选择图层的时候要先按住alt不放,然后再按鼠标右键。

Paste_Image.png

 隐藏图层。

Paste_Image.png

效果:

Paste_Image.png

 连续操作隐藏图层(背景图要隐藏干净):

效果,以及接下的步骤(切线就是一根根淡蓝色的线)

Paste_Image.png

保存切片1

Paste_Image.png

保存切片2

Paste_Image.png

保存切片3

Paste_Image.png

被局限的方法(原理是一样的):

这有局限

踩坑经历:

网上很多教程都说使用png格式就可以,却并没有说png-8或者是png-24,甚至有些教程告诉我使用png-8!在这里分享一波,保存切片必须使用png-24,因为我踩过坑了(/(ㄒoㄒ)/~~)

前端ps切图,图文教程,详细。的更多相关文章

  1. 学习笔记2:前端PS切图

    前端PS切图 一.Photoshop的界面设置 二.Photoshop的基本操作 三.Photoshop的传统切图 四.Photoshop的精准切图 五.Photoshop的扩展知识 视频学习:htt ...

  2. 前端PS切图

    http://www.imooc.com/learn/506    慕课网地址 Tools Tools  Photoshop 快捷键 l  移动工具 V l  选取工具 M l  套索工具 L l  ...

  3. 前端PS切图技巧

    先选择“编辑”-“首选项” 打开,找到“参考线”    设置一下每格网格 100像素 5个细块 确定后 ctrl+‘ 出现网格.(通过网格对齐切图比用参考线切图更好). 如果使用PS cc的软件的话, ...

  4. 【待整理】PS切图基础教程

    http://www.w3cfuns.com/article-442-1-1.html http://www.w3cfuns.com/article-443-1-1.html 其他专题研究: floa ...

  5. 前端菜鸟起飞之学会ps切图

    由于之前只顾着追求效率,没有学习过PS,但其实这是前端开发人员需要学会的技能之一,曾经看过一个大佬的前端经验分享说他在招聘时遇到不会切图的会直接pass掉,可见前端开发人员学会切图是多么重要.通过观看 ...

  6. 做一个会PS切图的前端开发

    系列链接 做一个会使用PS的前端开发 做一个会PS切图的前端开发 切图方法分类 PhotoShop从CS版本演变到现在的CC版本,切图功能发生了比较大的变化,我们可以把PhotoShop CS版本时的 ...

  7. 前端技术-PS切图

    页面制作部分之PS切图 <--本标签下,通过页面制作.页面架构.javascript程序设计.DOM编程艺术.产品前端架构五部分来分享总结笔记,总结笔记会陆续分享--> 网页设计在技术层面 ...

  8. 页面制作部分之PS切图

    页面制作部分之PS切图 <--本标签下,通过页面制作.页面架构.javascript程序设计.DOM编程艺术.产品前端架构五部分来分享总结笔记,总结笔记会陆续分享--> 网页设计在技术层面 ...

  9. PS切图保存后的背景图为透明

    1.若想PS切图保存后的背景图为透明,那么则需要在如下图中所示的修改即可,切图后[文件]——>[存储为web格式]——>[PNG-24]: 2.要想在css中的背景图片为相通,则先剪切一个 ...

随机推荐

  1. 设计模式之——Memento模式

    Memento模式即快照模式,就是在某一时刻,设定一个状态,在后面随时可以返回到当前状态的模式. 我们拿一个闯关游戏作为举例,一共有十关,每闯一关,玩家所持金额增加一百,而闯关失败就扣一百.初始时,给 ...

  2. Redis主从切换

    案例 易车网:http://www.greatops.net/?id=232 redis主从切换:http://www.cnblogs.com/itdragon/p/7932178.htmlhttps ...

  3. 剑指offer总结

    1.实现Singleton模式 2.二维数组中的查找:每行从左到右递增,每列从上到下递增,输入一个数,判断数组中是否存在该数 1 2  8 9  2 4  9 12 4 7 10 13  6 8 11 ...

  4. tools-eclipse-001-如何安装插件

    插件的安装方法大体有以下三种: 第一种:直接复制法: 假设你的Eclipse的在(C:\eclipse), 解压你下载的 eclipse 插件或者安装eclipse 插件到指定目录AA(c:\AA)文 ...

  5. mysql创建和删除表

    创建表 简单的方式 CREATE TABLE person ( ), name ), birthday DATE ); 或者是 CREATE TABLE IF NOT EXISTS person ( ...

  6. marathon-lb-什么是服务发现?(转)

    摘要: 将容器应用部署到集群时,其服务地址,即IP和端口, 是由集群系统动态分配的.那么,当我们需要访问这个服务时,如何确定它的地址呢?这时,就需要服务发现(Service Discovery)了.本 ...

  7. Grid Search学习

    转自:https://www.cnblogs.com/ysugyl/p/8711205.html Grid Search:一种调参手段:穷举搜索:在所有候选的参数选择中,通过循环遍历,尝试每一种可能性 ...

  8. 利用 TestNG 并行执行用例

    原文地址https://testerhome.com/topics/1639 一.测试类*注1 package com.testerhome; import io.appium.java_client ...

  9. 接口测试之接口api文档的重要性

    接口文档的特点 接口文档,顾名思义就是对接口说明的文档.好的接口文档包含了对接口URL,参数以及输出内容的说明,我们参照接口文档就能编写出一个个的测试用例.而且接口文档详细的话,测试用例编写简单,不会 ...

  10. Codeforces Round #513 by Barcelona Bootcamp

    A. Phone Numbers 签. #include <bits/stdc++.h> using namespace std; #define N 110 char s[N]; ], ...