如何将psd网页切图转换成html

html-css011

如何将psd网页切图转换成html,第1张

psd网页切图转换成html,其实psd的切图就是网页前端的初步设计,这时候,网页的形象已经出来了,然后需要做的就是前端人员将psd的切图,参考psd去用html+css等一些语言去完成设计,如网站的背景,就需要css的background来实现,具体看下代码:

<html>

<head>

<style>

body{

width:960px

//限定网页的宽度

margin:0

auto

boreder:1px

solid

#f00

//加个边框利于观察

}

</style>

</head>

<body>

<p>我是测试文字</p>

</body>

</html>

在Photoshop里不能将文件保存为.html格式,因为软件内没有封装该格式保存类型。

下面就用两个实例来证明推论的正确性。

实例一:用存储为方式来保存为网页文件。

1.打开任意图片,点击文件-存储为。

2.点击格式下拉列表,发现没有.html格式,只能放弃保存.html格式操作。

实例二:用存储为 Web 所有格式来保存为网页文件。

1.

2.点击预设,发现没有.html格式。

3.再点击预设下的下拉列表框,发现还是没有.html格式。此时彻底没辙,因为所有的保存方式都尝试过了,但最终没有发现.html存档方式。

由上述两个实例可以证明:Photoshop不支持保存.html格式文件,即不支持图片保存为静态网页文件。