用ps切图做网页是很多前端开发者要做的事情。那么ps怎么切图制作网页呢？下面小编就用一个简单的例子来为大家讲解一下。工具/原料morePhotoshop CCDreamweaver CS6网页图片方法/步骤1/13分步阅读

小编这里用Photoshop CC和Dreamweaver CS6来做演示。首先我们打开ps软件。

2/13

然后打开网页设计图，一般都是psd格式的，小编这里以简单的JPG格式代替了。

3/13

然后点击左侧工具栏中的“切片”工具，就是那个小刀子形状的。

4/13

之后在图片上切出想要做网页的部分，小编演示的比较简单，将整个图片切为若干份，先切中整个图。

5/13

然后在图片上右击，划分切片，分成若干就行了。

6/13

最后保存一下，选择存储为web所用格式。

7/13

选择好格式之后点击存储，如果不是透明的一般选择jpg格式。

8/13

保存的时候选择保存所有用户切片。

9/13

再然后就是制作网页了，我们打开Dreamweaver CS6，新建一个html网页文档。

10/13

然后将图片和html网页保存于同一个文件夹下。

11/13

html代码和css如下。

12/13

最后预览一下效果，还是不错滴~

13/13

最后愿天下有情人终成眷属！

注意事项

小鱼原创，欢迎转载！

PS网页PS教程网页制作