切图切图小知识

Posted 2020-09-09

最近在学习前端，所以萌生了对切图的学习，接下来分享下我的学习历程吧~

1．切图其实并不是直译的就是将图片切开那么简单，那么切图到底是什么意思呢？

切图概念：切图是指将设计稿切成便于制作成页面的图片，并完成html+css布局的静态页面，有利于交互，形成良好的视觉感。通俗来讲，把一张设计图利用到切片工具 把自己所需的切成一张张小图，然后用DIV+CSS完成静态页面书写，完成CSS布局。

2．切图工具：主流是dreamweaver、photoshop软件，还有sketch、firework等，低端QQ切图，网页切图等。

3．  Ps切图小练习，学习自“PhotoShop教程：切图那点事儿”，链接如下：

https://jingyan.baidu.com/article/93f9803fc50dd3e0e56f555e.html

通过这个练习，就会对切图有很省的理解哦。

4．  “新手福利！超全面的UI设计切图规范指南”链接为：

https://www.uisdc.com/ui-design-slice-guideline

切图是初级设计师最重要的能力，网上一直没有全面系统的教程，这篇好文从零开始教你学会切图方法，附上切图神器，绝对值得学习与收藏。

是不是看完这些觉得又Get到很多新知识啊~~