关于前端切图的问题

Question

切图就是把PSD文件的单个元素按照图稿的left和top的位置一个个放到指定的位置吗？不用考虑后台数据渲染时的数据结构的问题吗？感觉平时学的布局那些根本用不到 直接用绝对定位就可以了 我想问一下切图是这样的吗？

Answer 1

切图就是把psd的前端实现不来的元素切割，例如背景，彩色标题，图片，方便之后使用。
而前端需要做的就是完整还原psd！！这里就会涉及到flex布局，grid布局，响应式布局...
大部分的宽度都是不变的，变化的都是高度，涉及到数据过多或过少问题的时候，使用流式布局或者固定高度滚动显示多余数据。
涉及数据结构时，把后台给的数据结构改成需要渲染的结构，而不是直接渲染后台给结构。

Answer 2

不对哦,本身切图这个是从UI的角度来的东西,跟你说的这些都没关系.把一张大的psd源文件用工具或者一些插件按照区域进行切割保存到本地,你写代码再去用这种图片.否则一张集合了所有图片的图片你要来有啥用

Answer 3

切图是把一个UI图片里的图标抠出来，一般交给UI去做，前端不到万不得已，别去做UI的工作。

而题主说的定位，应该说的是“雪碧图”，就是把多个图标合成一张图片，显示的时候通过定位加隐藏的方式去显示，这样做的目的是减少资源的请求次数。

但雪碧图用起来并不太方便，很难做到自适应，如果可以，换成“字体图标”会更好。