用实例详细讲解PSD转成HTMLCSS.docxVIP

  • 12
  • 0
  • 约 10页
  • 2018-05-13 发布于广东
  • 举报
用实例详细讲解PSD转成HTML

用实例详细讲解将PSD转成HTMLCSS(上) HYPERLINK /space-uid-3.html 前端小编?发布于 2011-3-30 16:12 查看数: 11151 评论数: 5 HYPERLINK /thread-743-1-1.html 帖子模式 将PSD转成一个静态的html/css对一些朋友来说是一个很大的困扰。这个教程通过对一个完整实例的详细讲解,来教大家如何将psd转成html/css,以及JS插件的使用,制作完成的html/css页面兼容各种主流浏览器。 我们将设计页面分成基本的5个部分,每一个部分都有自己的容器wrapper和内容。基本的流程是先编写Html代码,然后通过编写CSS来还原psd设计稿。 1. 我们需要从PSD文件得到什么? 如下图,我们只需要从这个psd文件得到4个非常基本的东西。推荐内容(featured)的背景、底部背景、欢迎文字(Welcome)、推荐图片的框(少女面部图的白色透明边框)。其余的部分我们只需要通过CSS生成或者在html里嵌入相应图片。 下图红线圈起来的地方,就是我们需要从psd获取的内容。本部分内容需要读者具备一定的Photoshop的基础知识和操作能力。 你可以借助Photoshop的切片工具或者自己手动切片,并将其保存成相应的图片格式。 2.设置站点 为一个网站设置良好的开发环境是非常重要的,我

文档评论(0)

1亿VIP精品文档

相关文档