前端PS常用切图技巧】的更多相关文章

前言:前端涉及到的 ps 操作不算复杂,基本上就是切图,本文总结了常用的几种切图技巧. 工具:photoshop cs6 . photoshop cc 1. 传统切图 01 这是最笨的一种方法,核心就是用选区工具选中我们要的切图区域,复制到新文件,然后整个保存下来,这样的切图方法几乎没有可取之处,不过我最初确实就是这样干的... 2. 传统切图 02 这种效率要高一些,可以同时切多个图片,用切片工具选中多张我们需要的图片区域,点击文件->保存为 web 所用格式,这种方法的缺点是默认会保存多张图…
一些很简单的例子,知道的就当看乐子. 1.T 是文字的  可以从矢量图中查看文字的大小 字体 颜色,具体就是T  选择一段文字,点确定,点击属性栏最后一个可以看详细信息.又字体,行高,颜色.如果要选取字体 尽量把图放大些. 2.F8 可以查看选取的大小,X y坐标,Rgb颜色 3.魔法棒 选取选取,属性有连续喝不连续 4.测圆角:选择-修改-平滑 5.ctrl+T 变换选区 6.画布大小 调整画布大小,可以讲截得多张图 拼成一张精灵图. 12月5日更新 一. 1.移动工具V:属性自动选择(组),…
先选择“编辑”-“首选项” 打开,找到“参考线”    设置一下每格网格 100像素 5个细块 确定后 ctrl+‘ 出现网格.(通过网格对齐切图比用参考线切图更好). 如果使用PS cc的软件的话,就选择智能切图. 推荐两个PS插件切图插件,一个是cutterman切图,另一个LayerCraft切图.两个都比较方便,比原来PS CC切图更智能.…
AI的基本使用 1.选中多个不同图层. 首先在AI右边工具栏找到“图层” 然后选择需要切图的图层(按住“ctrl”点击) 最后拖到PS里面的新建的图层. 还有个问题,就是图层关联太多,无法拖动某些图层,需要的图层在上面,不需要的图层在下面, 解决方法就是先把不需图片拉开,然后用“选取工具”选择需要图层拉出来. 2.聚焦图层,双击某个图层即可聚焦到图层,可以重复点击,. 选中某个图层 双击图层 右边图层就可以筛选出聚焦的图层 注意顶部的导航 3.查看里面文字的信息 首先聚焦文字图层 然后找到“文字…
前端切图技巧 手动切图 参考线切图 精准切图 自动切图 原文地址 http://www.cnblogs.com/w-wanglei/p/5598336.html…
一,设置PS 使用PS进行切图前的设置: 1,打开PS----打开PSD图片----点击窗口-----分别把:历史记录,信息,图层,三个打勾. 历史记录:可以回到之前想要的步骤,特别是不小心把图层的文字或者图层删除了,进行恢复. 信息:可以获得框选部分的:rgb ,XY轴的起始位置,还有宽高. 图层:PSD图片,是通过很多图层叠加起来才变成视觉上为一个页面的效果. 2,设置自动选择图层:点击窗口----选项打勾----即显示顶部的选项,选项中的:自动选择:图层.自动选择打勾,并且把组改为图层.…
1.选框工具这里可以选择增加选区.减少选区 ==> 2.存储为web格式 1)JPG:一般用于大图 2)gif:可作动图,与png-8基本一样,不支持半透明 3)png-8:不支持动图,不支持半透明 4)png-24:只有这个,支持半透明 调整时可用ctrl加+放大查看 3.背景渐变的按钮,上头有文字,选中1px渐变条复制,按ctrl+T拉伸一下,将文字盖住 4.如果用选框选取四周都是参考线的选区,很有可能多选1px,解决方法是按住ctrl再去选,就能正好了 5.ctrl+alt+shift+E…
步骤1: ps打开psd文件 步骤2: 点击移动工具,观察左上角的自动选择是否有勾选 ,如果没有最好勾选,对应的选项有图层和组,善于切换这个功能能够有效快速的找到你要的区域 步骤3: 找到要切图的元素,将其他叠加的图层隐藏掉,通过参考线定位要要切图的区域. 步骤4: 点击切片工具,截取参考线定位的区域,右键可以修改切片的命名,或者删除切片,当一个或者多个切片切好之后,点击文件>导出>存储为web格式..可以将切片存储为图片 需要注意的是:1.修改图片的格式,例如png,需要点击每个切片修改,否…
今天想导出svg格式的图片支持webFont,结果AI打不开了,文件好像损坏了,于是就想办法在PS里面导出. 网上搜索到一篇文章,腾讯的 http://isux.tencent.com/ps-photoshop-cc-fd.html, 同时还会引用到一个三方脚本  http://hackingui.com/design/export-photoshop-layer-to-svg/ , 三方脚本的一篇文章 http://www.ui.cn/detail/53284.html. 最终找到了解决办法,…
前言:公司在前端组和视觉组交接设计稿切图的时候,总会因为视觉组同事们对前端的实现原理不清楚而出现各种问题,在用的时候还得再次返工,前端组同事们一致觉得应该出一份<设计稿切图通用性标准文件>,这里是我结合资料做出的一份总结. 1.切图资源尺寸必须为双数 2.LOGO类图片以方形切图输出    3.可点击部件要把相关状态都切图输出,比如正常状态.点击状态    4.同一类型图片保持同样大小尺寸输出切图 全屏切图类: 局部切图类: 空白页提示案例图:    5.有阴影背景的内容显示区域保持居中输出切…