如何用photoshop输出html网页


首先得先对PSD文件做切片,有两种方法:

①使用工具栏上的“切片工具”,

然后在图象上划出一块一块的区域。

②使用基于参考线的切片,按ctrl+R调出标尺栏,

把鼠标移动到标尺上,按住鼠标左键,移动到图象上,将会看到一条绿色的参考线,如图

将参考线;排好,然后点一下工具栏上的切片工具图表,然后点上面

选项栏里的“基于参考线的切片”。于是在原来的参考线上就变成了一块一块的切片了。

接下来就可以输出了:
①依次选择菜单栏上的“文件”→“存储为Web所用格式”→“存储”。

②接下来就会弹出一个“将优化结果存储为”的窗口,如图

在“保存类型”处有个下拉列框可以选择,因为我们要存储为网页的格式,所以选择“HTML和图象(* html)”,再选择“保存”就可以输出一个网页格式的HTML文件与一个包含图象的名为“images”的文件夹。

③如果我们需要输出“div+css的网页”我们还可以这么做:
在“设置”处的下拉列框,选择“其他”

就会弹出一个“输出设置”的窗口

在第2个下拉列框处选择“切片”

选择“生成CSS”



单击“好”→“保存”就可以输出一个目前流行的“div+css”的HTML网页。

ps中切片后的参考线

有时候我的图片需要重复用来切片,每次切片后,第二次打开就会出现上次切片后的蓝色切片线。尽管隐藏参考线或切片,也只是暂时的,当我再次点击切片工具,上次的蓝色切片又会出来。
怎样让他每次打开都是新的,不会再出现上次的切片了。
谢谢!

如果你不需要上次的切片,也就是不打算保留已使用过的切片,你可以点击“视图--清除切边(C)”清除切片,这样你就可以重新切片了。

如何用photoshop输出html网页的更多相关文章

  1. 如何用PhotoShop制作网站的favicon.ico

    所谓favicon,即Favorites Icon的缩写,顾名思义,便是其可以让浏览器的收藏夹中除显示相应的标题外,还以图标的方式区别不同的网站.当然,这不仅仅是Favicon的全部,根据浏览器的不同 ...

  2. asp.net 读取一个文本文件,并输出到网页显示 通过 一般处理程序实现

    asp.net 读取一个文本文件,并输出到网页显示 通过 一般处理程序实现 用这个可以做模板首页进行输出,也可以自已自定义进行扩展 //得到读取到的文本到string中 string resultTe ...

  3. 如何用phpcms将静态网页生成动态网页?

    在前两篇随笔中已经简单介绍了phpcms,那么现在让我们来看一下如何用phpcms将静态网页生成动态网页? 1.在templates文件夹下新建模板文件夹ceshi(名字可以自己随笔起) 2.在ces ...

  4. 简单思考 如何用PHP输出本周的周三日期

    简单思考 如何用PHP输出本周的周三日期?比如今天2017-10-31 计算本周周三应该是2017-11-01 自己动脑筋想一想,然后给我留言或者评论

  5. 如何用Photoshop画一个发光金币(unity游戏素材教程)

    做好的发光金币预览图: 以下为如何用Photoshop画一个发光金币教程: [1]如上图1-2,新建,名称改为Coin,宽度20像素,高度20像素,分辨率72,背景白色: [2]使用Alt+Shift ...

  6. HTML第二部分表单及使用Photoshop快速制作网页

    一.表单 <form id="" name="" method="post/get" action="负责处理的服务端&qu ...

  7. Android webView输出自定义网页

    这次来使用webview输出网页型数据.因为这样的数据好使用富文本编辑器,有各种各样的拓展. 上代码: package controller.hzl.com.testcall; import andr ...

  8. 如何用photoshop把一张图片分割成几张图片呢?

    今天情人节,祝大家节日快乐!朋友发来一张照片,我发现这张照片是几张照片组合起来的,是不是感觉每一张都是萌萌哒呢?为了体现单张的独特性,现在我要把它切分成单张,使用Photoshop CS5该怎么弄呢? ...

  9. 如何用chrome扩展将网页变成黑底白字,用以保护视力

    不知道有没有科学依据,自己感觉黑底白字对视力好些,于是动手加个chrome扩展: 第一步:建个文件夹,名称比如叫changeColor; 第二步:在changeColor文件夹中建三个文件:manif ...

随机推荐

  1. Selenium定位多个iframe嵌套中的元素

    在公司boss系统中,经常会遇到多层iframe嵌套的情况,导致无法定位最里面那层iframe的元素. 其实很简单,只要一层层定位iframe,定位到你想要的那层iframe即可: 如果操作完需要返回 ...

  2. Django models模型

    Django models模型 一. 所谓Django models模型,是指的对数据库的抽象模型,models在英文中的意思是模型,模板的意思,在这里的意思是通过models,将数据库的借口抽象成p ...

  3. DFS和BFS模板

    DFS: 该DFS框架以2D坐标范围为例,来体现DFS算法的实现思想 #include<cstdio> #include<cstring> #include<cstdli ...

  4. IOS编译报错:objc-class-ref in AppDelegate.o之解决方案 Xcode7

    Undefined symbols for architecture x86_64: "_OBJC_CLASS_$_QQApiInterface", referenced from ...

  5. pycharm的使用小技巧111

    如果你想快速敲出if __name__ == '__main__':只需你敲个main 然后回车就ok了 import和from xx模块 import *的区别是前者使用时要加模块名加点,后者可以直 ...

  6. [转]C#Linq中的Union All/Union/Intersect和Top/Bottom和Paging和SqlMethods,skip,take,takewhile,skipwhile,编译查询等

    本文转自:http://www.cnblogs.com/suizhikuo/p/3791799.html 我们继续讲解LINQ to SQL语句,这篇我们来讨论Union All/Union/Inte ...

  7. RabbitMQ六:通过routingkey模拟日志

    序言 本章文章进入深入了解RabbiMQ,平时项目中我们经常用到记录日志,常见的不外乎:Info.debug.warn.Error.     情境进入:先简单说一下我们需求,我们开发过程中会遇到很多日 ...

  8. html5表单新增元素与属性2

    1.标签的control属性 在html5中,可以在标签内部放置一个表单元素,并且通过该标签的control属性来访问该表单元素. <script> function setValue() ...

  9. 2017-11-29 HTML5样式、链接和表格

    HTML5样式.链接和表格HTML5列表<ol> 有序列表<ul> 无序列表<li> 列表项 <dl> 列表<dt> 列表项<dd&g ...

  10. Java常用的排序查找算法

    public static void main(String[] args) {      // bubbleSort(); // int[] a = {20,2,10,8,12,17,4,25,11 ...