缓存设置:

编辑-首选项-暂存盘

改完除了C盘之外的其他盘

单位设置:

编辑-首选项-单位与标尺

将单位修改成像素

 PS预设:

工具   (窗口-工具)

标尺  (视图-标尺)

图层  (窗口-图层)

信息   (窗口-信息)

字符   (窗口-段落)

框选一块区域后,可以在信息里查看尺寸相关

借助辅助线切图:拉好辅助线,使用裁剪工具框选住,裁剪出来

一个裁剪png图片的好方法:

文件新建创建一个透明图层

选择工具,选中所需要的图层,拖拽到新文件的透明图层上

图像-裁切-基于透明图像裁切

成功裁剪出一个最小范围的完整的png图片


切片工具可以一次完成所有需要的图片的裁切,但是效率不高,不推荐使用

图片存储中:PNG8和PNG24的区别

低版本IE不支持PNG24,会出现模糊的情况,并且背景会填充颜色

PNG8颜色饱和度不如PNG24

一般还是建议使用PNG24


统一色块的一块区域,只需要设置宽度或者高度为1像素即可,在代码中设置重复平铺即可

图片越多,网页加载越慢

可以将很多小图标放置在一张图片上:雪碧图


切图的优化

颜色代替图片

雪碧图的制作

字体图标的使用

切图常用快捷键

删除图层 delete

合并图层 ctrl+e

切图辅助工具

Markman  (便于测量颜色、间距等)

Tinypng  (用于压缩图片)

前端自动化

PS切图工具的更多相关文章

  1. Assistor PS 切图工具的使用说明。

    一.如何运行Assistor PS   使用这个Assistor PS 软件有一个最最重要的条件,那就是:你要打开你的Photoshop (官方建议版本在CS 3以上)   下载-安装-运行. 运行成 ...

  2. ps切图插件

    ps切图工具插件 下载网址:http://www.cutterman.cn/zh/cutterman 安装完插件,关闭ps,重新打开,窗口- 扩展,即可使用

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

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

  4. ps切图抠图详解-web前端(转)

    网页设计在技术层面上,第一步是美工做出网页效果图,第二步就是网页前端进行网页切图.网页切图工具常用的有fireworks.PS,这里使用PS进行网页切图. 我们通过设计稿,得到我们想要的产出物(如.p ...

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

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

  6. 前端技术-PS切图

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

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

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

  8. 前端PS切图

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

  9. 两种ps切图方法(图层/切片)

    两种Ps切图方法 一.      基础操作: a)    Ctrl++ 放大图片,ctrl - -缩小图片 b)    按住空格键space+,点击鼠标左键,拖动图片. c)    修改单位,点击编辑 ...

随机推荐

  1. SpringBoot初级知识总结,太难了,未完待续.......

    idea如何打包发布springboot 1.1.环境准备window系统,jdk8环境,springboot项目,maven3.5.4环境 1.2.进行打包发布 打开idea编辑器,打开一个写好的d ...

  2. CSS-10-内边距

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. 2、初始ES6及Vue

    今日内容 es6的语法 let 特点: 1.局部作用域 2.不会存在变量提升 3.变量不能重复声明 const 特点: 1.局部作用域 2.不会存在变量提升 3.不能重复声明,只声明常量 不可变的量 ...

  4. java线程基础梳理

    java线程 概述 进程:运行时概念,运行的应用程序,进程间不能共享内存 线程:应用程序内并发执行的代码段,可以共享堆内存和方法区内存,而栈内存是独立的. 并发理解:在单核机器上,从微观角度来看,一段 ...

  5. map实现单词转换程序的例子

    代码来源于c++ primer 10.3 功能:已知一个一一对应的词典,求一小段文档对应的“翻译” 词典如下: A a B b C c D d E e 输入: D D E 代码: //需要两个文件,一 ...

  6. 安装MySQL出现[Errno 256] No more mirrors to try

    今天安装数据库时出现错误提示,如下图: 解决办法如下: yum clean all #清除仓库缓存 yum makecache #将服务器包信息缓存到本地 然后再执行数据库安装指令 yum insta ...

  7. Spring IoC 容器和 bean 对象

    程序的耦合性: 耦合性(Coupling),又叫耦合度,是对模块间关联程度的度量.耦合的强弱取决于模块间接口的复杂性.调用模块的方式以及通过界面传送数据的多少.模块间的耦合度是指模块之间的依赖关系,包 ...

  8. 分享数百个 HT 工业互联网 2D 3D 可视化应用案例之 2019 篇

    继<分享数百个 HT 工业互联网 2D 3D 可视化应用案例>2018 篇,图扑软件定义 2018 为国内工业互联网可视化的元年后,2019 年里我们与各行业客户进行了更深度合作,拓展了H ...

  9. 如何快速搭建一个 Node.JS 项目并进入开发?

    了解:如何快速搭建一个项目并进入开发? 在此不概述 Node.JS 的历史以及发展过程. 因为之前接触过通过 Java 开发语言,所以明确地知道一个服务器所需的文件,以及一个服务器所需要的操作. 那么 ...

  10. openstack启动云主机的流程

    看一下openstack启动云主机的流程图 通过上图分析可以知道: 1. 用户使用Dashboard或者CLI 把认证信息通过REST请求发送给keystone进行认证.2. Keystone校验用户 ...