• wordpress CMS主题:ssmay主题wordpress CMS主题:ssmay主题
  • 首页 > wordpress CMS主题制作 > wordpress CMS主题模板制作教程(04):face主题效果图切图(1)

    wordpress CMS主题模板制作教程(04):face主题效果图切图(1)

    作者: 分类:wordpress CMS主题制作 点击: 1,639 次
    wordpress CMS主题:ssmay主题

      本意接着上一章接着往下讲。要开发一个网站,首先要有一个效果图,也就是你要将你的网站开发成什么个样子。wordpress CMS主题开发也是一样。这里我直接从网上下载了一个网站的效果图(如下图)。我们要想让face主题效果跟效果图一样,我们要对它进行切图。那么,如何切图呢?

      wordpress CMS主题模板制作教程(04):face主题效果图切图(1)

      所谓切图,就是用html代码把效果图在浏览器中展现出来。切图有2个步骤,一起来看看。

      第一步:通过PS软件(photoshop)给效果图切图。

      意思就是说,把效果图中小图切出来。用PS打开效果图,右键点击左侧工具中的裁剪工具,再选择“切片工具”,如下图:

      wordpress CMS主题模板制作教程(04):face主题效果图切图(1)

      然后,在效果图中拖动鼠标,选择需要切片的小图片(如何使用切片工具,要以参照一下网上的教程,很简单)。如下图:

      wordpress CMS主题模板制作教程(04):face主题效果图切图(1)

      选好切图后,我们就要把这些切图保存下来,点击“文件”=>“存储为web和设备所用格式”,如下图:

      wordpress CMS主题模板制作教程(04):face主题效果图切图(1)

      选择切图格式,这里选择JPEG中,

      wordpress CMS主题模板制作教程(04):face主题效果图切图(1)

      点击“存储”按钮,弹出弹窗,可以选择“所有切片”,也可以选择“所有用户切片”,这个根据自己需求来选择,我这里选择“所有用户切片”,如下图:

      wordpress CMS主题模板制作教程(04):face主题效果图切图(1)

      记住切图保存的位置。我这里保存的位置是“我的文档”,切图会自动保存在“我的文档”目录下的images目录下。我这里保存的格式是“仅限图像”(上图所示),我们也可以保存为“html 和图像”,这样会把切图保存一个效果图html页面,可以在浏览器效果展示,但是,默认保存的代码是用table表格写的,不过,我们大多是用DIV来写代码。这就要对PS做一些设置,我们在下一章中再做介绍。

      第二步是“html代码来实现效果图”,这个留到下一章来说,敬请期待。本章就介绍到这里。



      QQ二维码

    文章作者:高时银博客
    本文地址:http://wanlimm.com/77201707025414.html
    版权所有 © 转载时必须以链接形式注明作者和原始出处!

    上一篇:
    下一篇:
    wordpress CMS主题:ssmay主题

    或许你会感兴趣的文章:

    发表评论

    电子邮件地址不会被公开。 必填项已用*标注

    This site uses Akismet to reduce spam. Learn how your comment data is processed.