网页切图是网站前端制作人员的工作一部分，一般网页切图指的是网站从效果图中获得切片并使用切片来制作网站前端静态页面。网站切图原则：
尽量少切图，能使用css编写的尽量使用css样式编写出想要的效果
网页禁忌全部使用图片切成，这样会使网页上很多文字不利于后期修改，同时增加了网页的加载速度。
网站切图小图片尽量放在一张图片上，减少网页访问时对服务器的请求数，因为一个图片就是一个次请求。
背景图片可以平铺的尽量切成一个小单元平铺，可以减少图片的大小。
切图需要降低图片质量，在保证质量的情况下，缩小图片占用内存的大小。
网站切图因网页布局决定，并不是除按钮以外都可以当做背景。
background-image:url('')设置图片路径background-position:
-100px
-122px
设置图片中某一部分图的位置
第一个值是上
第二个值是左
然后通过这个图片外层标签来显示图片显示的范围
宽度和高度
切图是设计师交付给开发的产物之一，设计稿完成后，设计师需要将其切成便于制作成页面的图片。但因为开发经常需要不同平台不同尺寸的切图，如果全部由UI来做，不仅费时费力，可能还会因为细微的差距造成开发不能很好的还原设计稿。
所以可以用摹客之类的专业工具来自动切图。UI把Sketch、Adobe XD、PS的设计稿进行切图标记，上传至摹客后，开发就可以自主下载不同平台不同尺寸的切图和使用了。
扩展资料：
切图用于完成html+css布局的静态页面，有利于交互，形成良好的视觉感。通俗来讲，把一张设计图利用到切片工具 把自己所需的切成一张张小图，然后前端开发用DIV+CSS完成静态页面书写，完成CSS布局。
切图大家都有个误区，觉得切图就是把图片切出来，其实并不完全是这样，首先处理的是什么类型的页面图片型（EDM 或活动着陆页等）、图文型（门户网站或电商网站等）、界面型（Web App 等），把图片切出来这个过程是叫切片。
参考资料来源：百度百科-切图
