用photoshop制作web标准页面

先前看过一个类似的教程，可就是老记不起来，今天在做电子期刊的时候，一下子想起了这个东东，在做好PSD，切好片之后，我就琢磨着乍么让这photoshop可以自动生成一个DIV+CSS的页面，这样比较符合现在的趋势。一阵乱搞乱整之后，我把他整出来了，大家认真看步骤喔：

step1:
将要进行页面输出的PSD源文件（其实其它的也可），用工具箱中的切割工具，将PSD切割好，如图


step2:
选择菜单栏中的 文件--->存储为Web所用格式




step3:
点击预设旁边的小三角，对输出的图像进行设置





step4:按照如下图进行设置





step5:确定后，返回第三步的页面，点击存储就完成咯.


我们来看一下它生成的代码：




可以看到，CSS我们就不用写得这么劳神了，不过毕意是机器自己生成的，不能算得上是完全符合标准，我个人认为，在做一些网站的导航页应该比较有用，主要是在页面元素少的时候可以用吧。整个网页的构架基本上符合了DIV+CSS的架构，CSS的生成也很不错喔！

很简单的，建议大家看了之后可以马上试试！可能有些错误，欢迎大家多多指教：）

上一篇: ASP.NET1.0与ASP2.0连接字符串的设置的不同
下一篇: 德仔工作室Web技术电子期刊第九期(2006.No8)
文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags:
相关日志: