PxCook+photoshop实现傻瓜式切图（推荐小白使用）

sorra 发布于2019-08-01 18:36 / 1644人阅读

摘要：今天我就带领小白学习傻瓜式切图。所需软件像素大厨可以对设计图进行标注。从而可以更方便的进行开发。这里我们使用的是它的插件完成切图。勾选启用远程连接，输入密码，点击确定。如果出现下面的界面，恭喜你，连接成功啦这就表示你可以开始切图。

确定需求

刚入门前端的小伙伴经过一个阶段的学习，已经准备小试牛刀了。但看到设计师给出的psd图，又头疼了，天啊撸，怎么办，我不会切图啊。今天我就带领小白学习傻瓜式切图。包学包会。(￣▽￣)"

所需软件

PxCook

photoshop

PxCook（像素大厨）：可以对设计图进行标注。从而可以更方便的进行开发。这里我们使用的是它的插件完成切图。

PxCook与ps连接

使用photoshop打开你的psd图，通过编辑->增效工具->开启远程连接的支持。勾选"启用远程连接"，输入密码，点击确定。（记住这一步的密码，之后要用）
打开PxCook软件，点击右上角的切图图标。如下图所示。

会弹出弹窗，如下图所示。

输入刚刚在ps界面输入的密码。点击开始使用。如果出现下面的界面，恭喜你，连接成功啦！这就表示你可以开始切图。

切图步骤

选择你要切的图层，点击切所选图层按钮在弹出层上面的路径上就可以找到所有切的图片。
纸上得来终觉浅，我们来实际操作下把~
使用ps打开一张psd文件，按照如下操作，稍等片刻，就可以在路径下找到切好的图了。

小技巧：如果要把很多图层一起切，可以新建组，把要切的图层放到组里面，选中组，点击切所选图层按钮即可。

是不是很简单，学会了不妨点个赞。

超融合服务器服务器托管阿里云vps小白怎么使用 PxCook 推荐使用傻瓜

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/51849.html

前端如何快速切图

摘要：选择适合我们自己的需求的格式，点击切所选图层即可导出到指定的路径下面。通过这两个工具的混合使用，困扰我的问题得到了解决，妈妈再也不用担心我的切图了。废话不多说我们直接进入正题正所谓：‘工欲善其事，必先利其器’，好的开发工具能够极大的提高我们的开发效率。 Pxcook（高效易用的自动标注工具, 生成前端代码, 设计研发协作利器） Adobe PhotoShop CC 2018(推...

shevy 2019-08-23 10:33 评论0 收藏0
前端切图工具-踩坑记_08

摘要：前端切图工具作为一个前端切图仔总是避免不了切图的痛苦强大的不得不说这个工具强大，不仅由版也有，也不收费。基本已经够用的，这个软件收费而且没有版本。前端切图工具作为一个前端切图仔总是避免不了切图的痛苦强大的PxCook PxCook不得不说这个工具强大，不仅由MAC版也有Windows，也不收费。具体看官网的安装和教程就好了，真的强大分享一下photoshop mac Phot...

haobowd 2019-08-02 12:06 评论0 收藏0
前端切图工具_08

摘要：前端切图工具作为一个前端切图仔总是避免不了切图的痛苦强大的不得不说这个工具强大，不仅由版也有，也不收费。基本已经够用的，这个软件收费而且没有版本。前端切图工具作为一个前端切图仔总是避免不了切图的痛苦强大的PxCook PxCook不得不说这个工具强大，不仅由MAC版也有Windows，也不收费。具体看官网的安装和教程就好了，真的强大分享一下photoshop mac Phot...

rockswang 2019-08-29 17:24 评论0 收藏0
浅谈 CSS Sprites 雪碧图应用

摘要：编写配置文件，以下是关键配置代码雪碧图合并输出到文件参数执行目录参数生成的和图片的文件名之所以推荐，是因为非常的灵活，看懂模块的可以根据你的项目情况编写对应的配置文件。 showImg(https://segmentfault.com/img/bVGpAw?w=518&h=156); 前言网站开发90%会用到小图标，多小图标调用显示是前端开发常见的问题；目前小图标显示常见有两种方式...

MkkHou 2019-08-30 13:12 评论0 收藏0