缓存设置:

编辑-首选项-暂存盘

改完除了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. jmeter使用—正则表达式提取器

    当我们测试接口的时候,有些请求参数是需要从上个接口返回获取的数据,这样的话我们就需要用到关联了.今天我们使用的关联是正则表达式提取器来进行获取需要关联的数据. 下面来具体说明正则表达式提取器的使用方法 ...

  2. CSS-18-媒体查询

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

  3. openlayer3 坐标系转换

    'EPSG:4326'-经纬度坐标-WGS84'EPSG:3857'- xy坐标-web墨卡托 ol3默认的坐标系为3857,即在创建ol.map的时候,若不指定projection,则默认为EPSG ...

  4. ElasticSearch入门篇Ⅰ --- ES核心知识概括

    C01.什么是Elasticsearch 1.什么是搜索 垂直搜索(站内搜索) 互联网的搜索:电商网站,招聘网站,各种app IT系统的搜索:OA软件,办公自动化软件,会议管理,员工管理,后台管理系 ...

  5. Intent传递实现Parcelable接口的对象

    Intent可以传递基本数据类型,在对象实现了Parcelable接口后,Intent也可以传递对象. 1. 使类ListVideo实现了Parcelable接口. package com.examp ...

  6. 教你如何快速上手markdown语法,编写技术博客(史上最全最简,用MarkDown写博客)

    首先,进行有道云笔记官网,新建一份markdown文档, 如下图 然后,在文档编辑区,左边,复制如下段落文字 加粗 斜线 标记颜色 下划线 废弃线 一级标题 二级标题 三级标题 四级标题 五级标题 六 ...

  7. PHP5.3的VC9、VC6、Thread Safe、Non Thread Safe的区别

    PHP一共给了四个版本,VC9 x86 Non Thread Safe.VC9 x86 Thread Safe.VC6 x86 Non Thread Safe.VC6 x86 Thread Safe, ...

  8. ceph集群部署

    最近在学习 kubernetes 过程中,想实现 pod 数据的持久化.在调研的过程中,发现 ceph 在最近几年发展火热,也有很多案例落地企业.在选型方面,个人更加倾向于社区火热的项目,Gluste ...

  9. 《自拍教程14》Linux的常用命令

    Linux操作系统, 包括我们大家熟知的Android, Ubuntu, Centos, Red Hat, UOS等. 这些常用命令先大概了解下,当然能熟练掌握并运用到实际工作中那最好不过了. 后续技 ...

  10. 一台机器上同时运行两个tomcat

    修改conf/server.xml文件,修改地方有三处 如图