Question

UI 中网页设计切图怎么切

Answer 1

PxCook，目前我还没用上Mac，所以也不知道传说中的Sketch到底多神奇。PxCook在Windows上标注还比较顺手，虽然它还附带切图功能，但是比较鸡肋，不推荐用它切图。
切图工具：
Cutterman 一款PS的插件，切图非常方便，但不支持绿色免安装版本PS，而且对PS版本要求比较高，针对CS 6的已经不维护更新了。推荐安装官方完整版PS cc，然后自行破解。官网上有安装使用教程，自己研究下吧，因为我也是最近才开始接触这款插件。
Part 2 Photoshop
现在常用的几种设计尺寸
1. 640*960 4时代的尺寸，刚接触APP设计用的是这个尺寸，拟物盛行的时代(现在用这个尺寸设计的应该比较少了吧)；
2. 640*1136 5/5S/5C，IPhone更新，咱们设计也得跟着与时俱进(应该还有人用这个设计尺寸)，进入扁平的时代了；
3. 750*1334 6 目前我做设计稿的设计尺寸，IPhone6的尺寸，向下可以适配4，5，向上可以适配6 plus；我记得IP6推出后，我问总监应该用什么尺寸设计，他说用IP6的吧，好适配，切出来就是@2x了，改一改上下都能照顾到。

Answer 2

都没人手动切图啦，现在有很多自动标注的工具了，比如蓝湖，下个插件，把设计图传上去就行了。

Answer 3

可以选择Cutterman，它是一款运行在photoshop中的插件，能够自动将你需要的图层进行输出， 以替代传统的手工 "导出web所用格式" 以及使用切片工具进行挨个切图的繁琐流程。 它支持各种各样的图片尺寸、格式、形态输出，方便你在pc、ios、Android等端上使用。 它不需要你记住一堆的语法、规则，纯点击操作，方便、快捷，易于上手。

Answer 4

切图是指将一张完整的设计稿中部分元素或组件切出以便于制作成页面。
切图用于完成html+css布局的静态页面，有利于交互，形成良好的视觉感。
通俗来讲，把一张设计图利用到切片工具 把自己所需的切成一张张小图，然后前端开发用DIV+CSS完成静态页面书写，完成CSS布局。
以前都是手动切图特别浪费时间，而且常常要根据各种不同的格式一张图切好多次，现在有很多可以一键切图的软件，比如蓝湖。通过插件上传的时候标记一下就可以去web端直接下载各种格式的切图了，非常的省事和省时间。

Answer 5

切图是指将设计稿切成便于制作成页面的图片，并完成html+css布局的静态页面，通俗来讲，把一张设计图 利用到切片工具 把自己所需的切成一张张小图，然后用DIV+CSS完成静态页面书写，完成CSS布局。
切图就是将 .psd 设计稿还原成 Web 页面的过程，这个过程包括两部分：
切出素材、编写代码实现
现在切图比较简单，一键基本就能搞定了，可以试试蓝湖。