如何用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. [SHOI2002]取石子游戏之三

    Wythoff's Game,详解请见浅谈算法--博弈论中的例6 /*program from Wolfycz*/ #include<cmath> #include<cstdio&g ...

  2. [ZPG TEST 114] 阿狸的英文名【水题】

    1.      阿狸的英文名 阿狸最近想起一个英文名,于是他在网上查了很多个名字.他发现一些名字可以由两个不同的名字各取一部分得来,例如John(约翰)的前缀 “John”和Robinson(鲁滨逊) ...

  3. 51nod1099 任务执行顺序

    #include <bits/stdc++.h> using namespace std; int main() { int n; cin>>n; int r,o; int s ...

  4. C# 判断文件和文件夹是否存在并创建

    C# 判断文件和文件夹是否存在并创建 using System; using System.Data; using System.Configuration; using System.Collect ...

  5. 200 Number of Islands 岛屿的个数

    给定 '1'(陆地)和 '0'(水)的二维网格图,计算岛屿的数量.一个岛被水包围,并且通过水平或垂直连接相邻的陆地而形成.你可以假设网格的四个边均被水包围.示例 1:11110110101100000 ...

  6. Win10 1803更新UWP无法安装的解决办法|错误代码0x80073D0D

    升级Win10 1803后,出现了之前安装的UWP.应用无法更新,再此安装失败的现象. 应用商店错误代码为:0x80073D0D,尝试卸载重装商店,清除应用缓存也无法解决. 最终解决办法: 下载Eve ...

  7. 轻松搞定Spring+quartz的定时任务

    1.spring 的定时任务写法有两种:一种是继承工作类,一种是普通的Bean,定时写法有两种写法:一种是以时间间隔启动任务SimpleTriggerBean,一种是以时刻启动任务CronTrigge ...

  8. 移动端使用页尾文字使用绝对定位遇到input框会飘起来的处理方案

    如下版权信息的样式在遇到input框的时候会跟随输入框其后 优雅的解决方式:(定位遇上键盘飘窗解决) mounted里面写上:var originalHeight=document.documentE ...

  9. HDU_1856_带权并查集

    有10000000个同学,他们之间可能是直接朋友或者间接朋友,问最大的朋友圈有多少人. 一直觉得10000000的数组开不了,用map优化了一下,结果能开,且10000000也不会超时... #inc ...

  10. Java入门第39课——猜字母游戏之实现字母生成方法

    问题        实现猜字母游戏中的字母生成方法,即,随机生成5个不同的字母作为猜测的结果. 方案        实现generate方法,首先声明一个字符类型的数组,用于存储26个大写字母,然后声 ...