前端开发-切图初了解

UI设计师会用Photoshop等工具做出网站效果图，是整张的大图，不可能整张拿来用，因此要切图。

前端工程师负责切图，从效果图上切出需要的小图，如logo和图标等，并做成HTML+CSS的网站效果。

切图工具有很多，这里用Photoshop，版本最好是Photoshop CS4以上版本。

从网上找一张图片或者截图作为练习素材，用Photoshop打开，选择切片工具。

依次选择要切片的区域，然后点击 文件》存储为web所用格式，出现对话框。

点击浏览或者带？的地球图标，可以预览效果，下拉可以看到HTML代码，此代码可以复制出来作为模板使用。

点击存储可以选择路径，确定后，会在相应文件夹下自动建立一个image文件夹保存切片出来的小图片。

修改复制出来的HTML代码，将图片src路径修改，不用图片的地方填充其他内容，完成后保存，运行查看效果。