做好的网页平面图用Photoshop怎么正确切图

作者&投稿:冯妍 (若有异议请与网页底部的电邮联系)
做好的网页平面图用Photoshop怎么正确切图~

Photoshop软件,简称“PS”,是由Adobe Systems开发和发行的图像处理软件,Photoshop主要处理以像素所构成的数字图像,其众多的编修与绘图工具,可以有效地进行图片编辑工作。用Photoshop cc2014软件将做好的网页平面图切图的详细制作方法是:
1、打开ps软件,“文件--打开”做好的网页平面图;

2、打开“切片工具”,设置“样式”正常;

3、用“切片工具”在图片上右键打开--划分切片,根据实际需要,设置“切片”数,“水平划分为”2,“垂直划分为”2,确定;

4、“文件--存储为web所用格式”,存储,取好文件名,保存;

5、打开电脑“文档”,可以看到一个专门文件夹“images”,打开文件夹即可看到切好的图片了。


  photoshop做网页的切图方法:
第一步 用PS打开网页效果图PSD文件,根据网页效果图拉出参考线,同时为了方便切图可以右键点击把面板的颜色自定成对比鲜明的颜色。
第二步 在PS图层中找出主背景图层,如果背景图是渐变的话可以只切出一两像素,后面再代码中设置填充。
第三步 隐藏其他图层,把背景图切出来。如果背景图很大,可以考虑分段切出,这样可以加速网页加载。
第四步 切出背景后,就从上到下,先把LOGO切出。这里同样要隐藏其他图层,输出图片的时候保存文件类型选择png,因为这样可以使得图片背景透明。
第五步 导出图片可以选择文件——存储为web和设备所有格式。
第六步 在保存切出图片的时候,选择保存HTML和图片,这样导出来的就会自动生成一个网页页面和切图图片。
第五步 在切像尾部版权部分的背景时候,发现这个是渐变图层,这样就可以只切出一个像素的长度。然后在代码中设置repeat-x横轴填充。

Photoshop软件,简称“PS”,是由Adobe Systems开发和发行的图像处理软件,Photoshop主要处理以像素所构成的数字图像,其众多的编修与绘图工具,可以有效地进行图片编辑工作。用Photoshop cc2014软件将做好的网页平面图切图的详细制作方法是:

1、打开ps软件,“文件--打开”做好的网页平面图;

2、打开“切片工具”,设置“样式”正常;

3、用“切片工具”在图片上右键打开--划分切片,根据实际需要,设置“切片”数,“水平划分为”2,“垂直划分为”2,确定;

4、“文件--存储为web所用格式”,存储,取好文件名,保存;

5、打开电脑“文档”,可以看到一个专门文件夹“images”,打开文件夹即可看到切好的图片了。



感觉这个问题就像如何用代码写程序一样。
不过还是提供一些基本方法,PS好的图进行切图,切出必要的元素信息,注意不是把一个图切开用代码拼起来,是切成一些小部件出来。然后在页面中一些效果用代码实现,一些硬性的地方用图片实现。

建议安装一个蓝湖这类的插件来做切图,比手动切图效率要高很多

产品经理与设计师沟通需求,通常会用产品文档或 Axure 原型,在一起办公时大家开会讨论,面对相同的屏幕口述,都需要反复沟通才能说清楚。远程办公中,就可以将Word、PDF、Excel、PPT 和任意链接格式的需求文档上传至蓝湖;一键生成邀请链接发送给团队成员,团队成员加入后,大家都可以看到相同的内容,结合视频会议,通过打点标注的形式,即可将产品需求表达得清清楚楚,还能反复查看避免遗漏。

现在还在用 PS 手动慢慢切图吗?这多麻烦呀,建议用蓝湖一键切图,自动生成开发需要的所有切图格式,开发选择自己需要的格式下载使用,很方便,真的别再手动了,效率低,还显得个人不专业


ps跟cad的区别是什么呀
CAD以具有图形功能的交互计算机系统为基础,由工具栏、菜单设计、对话框、图形打开预览、信息交换、文本编辑、图像处理和图形的输出预览组成。2、功能上的区别 Photoshop重点在于对图像的处理加工;图形创作软件是按照自己的构思创意,使用矢量图形等来设计图形。CAD为用户的绘图带来很大方便。正交功能使用户可以...

有什么编程软件能编写DOS图形界面(c语言怎么在dos窗口编程)
有photoshop,但是比较专业,你也可以用美图,百度魔图等简单操作如果要求不是很高。photoshop基于像素的图像处理软件主要应用于照片处理平面图像广告设计coledrew基于矢量图行设计软件主要应用于徽标设计等平面矢量图设计工作(矢量图最大特点是放大不失真)3dmax立体图像设计软件主要应用于立体效果图设计如装修户外...

PS怎样将CAD白色平面图P成透明
用魔术棒取出图形,新建==选择背景内容为透明就好了

画平面图时,要用到的快捷键有哪些?怎么使用那些快捷键?
刚接触电脑的画图软件,却不懂怎么使用快捷键,有人能告诉我画平面图时,要用到的快捷键有哪些?怎么使用那些快捷键?... 刚接触电脑的画图软件,却不懂怎么使用快捷键,有人能告诉我画平面图时,要用到的快捷键有哪些?怎么使用那些快捷键? 展开  我来答 ...

求把图p成平面图,只保留logo,谢谢
p成平面图,只保留logo,是这意思吧?

建筑方案展示时那些很好看的鸟瞰图透视图各种功能分析图都是用什么...
效果图:3dmax建模渲染, ps后期处理 平面图 :cad绘制, ps或者AI后期处理 部分草图用的草图大师,或者手绘的。

PS包装盒平面展开图如何在打印的时候有折痕线?
4:做圆图速度超大的包装盒,折开局部来做,做好局部再拼 5:做图(包装盒展开图)时,以包装盒的正面(主要面为主,主正)6:裁切线(套板色)模切板(放Illustrtor中的模切板最好)折痕线,切除线,不标尺寸 线粗细用1pt,用线条偏移做 效果图用Photoshop中做 1:注意透视点 2:100--150pt就可以了 ...

有没有p图软件可以给车p成低趴?
1.首先为大家介绍是Photoshop软件,简称PS,是一款专业的图像处理软件,国外公司制作的一款收费软件,被广泛应用在平面设计,广告摄影,网页图片制作等多个方便,是目前使用人数最多的P图软件,PS软件优势比较明显,功能强大,使用人数多,学习教程很多非常方便学习,当然也有弊端就是功能繁琐,新手入门比较难,...

绘图软件有哪些?
为用户提供着丰富的像素描绘功能和顺畅灵活的矢量图编辑功能,并能够快速的创建设计工作流程。9.PhotoshopPhotoshop是一款十分强大的图形图像处理软件,其也一直占据着图像处理软件的领袖地位,是平面设计、建筑装修设计、三维动画制作和网页设计的必用软件。整理了这么多,希望对您有帮助,望采纳~...

平面图中A-P是什么意思
字母外边有没有圆圈?有圆圈就是A轴到P轴

三穗县17373933479: 网页 设计整站样式,是用photoshop,还是用其它软件. -
错贷复方: 用ps做好模版 样式…… 然后用切片工具切图…… 根据你的设计需要去切.最好把所有的文字都隐藏…保存web格式后 会有个文件夹 里边都是你切的图片… 再到dw里去编辑、去添加文字

三穗县17373933479: 用photoshop制作网页有什么优缺点? -
错贷复方: photoshop是作图软件,可以用来做网页上的图,或平面设计 但要网页动起来,还是要专门制作网页三剑客Macromedia Dreamweaver Macromedia Flash Macromedia Fireworks

三穗县17373933479: 网页设计、网页制作、平面设计、平面制作分别用什么软件? -
错贷复方: (1)一般平面代码类的用Dreamweaver即可,如你说的网页设计网页制作,后台代码类的 Dreamweaver也可以在其中操作,也有用php,jsp等专用软件的(2)平面图一类的,用AI,PS,CDR的都比较多 AI主要用于布料,衣服类,画册等印刷图案 PS主要用于平面广告图设计,如网页上的图片 CDR主要用于书面图纸类的印刷

三穗县17373933479: 用PS做好网页图片,怎么样快速变为网页 -
错贷复方: 1、先打开photoshop设计好你的网页背景,如图所示,如何设计这样的页面我就不讲了,不属于该经验的内容,下面就是要介绍如何将这样的图片转换问网页.2、在工具栏选择【切片工具】,大部分人的工具栏只显示裁剪工具,右键单击裁剪...

三穗县17373933479: 网页制作一定要先用photoshop制作效果图吗? -
错贷复方: 不一定,如果是制作简单的表格式网页或是有现成模板的就可以不用 【备注】1. 做网页用Photoshop制作出效果图,是为了能直观的展现网页,让客户了解网页的排版和设计效果.2. Photoshop制作效果图能给程序员一个直观的表达形式,不用再制作的过程中再去考虑排版和效果的展现.

三穗县17373933479: PS对制作网站有用吗
错贷复方: 很多网站的界面模版都是用photoshop设计的,由于PHOTOSHOP在平面设计上的强大功能,如果你想把网站做得漂亮,它是必不可少的.而且在Adobe收购了网页三剑客后,PS已经与FLASH、DW整合在一起,在设计网页和动画时可以非常方便地相互调用、修改.

三穗县17373933479: 如何用photoshop做网页效果图教程 -
错贷复方: 如果是给个人做,怎么做都无所谓.如果是在公司里给客户做.这一步不可少,出了效果图后,要给客户看.等客户确定不再修改时再做网页,目的就在于防止客户反复修改,动布局! 另外会做网页效果图,代表你的设计能力.用dreamweaver...

三穗县17373933479: 怎样用Photoshop软件设计网站?
错贷复方: PS只是图片处理软件,但你可以用它来设计网站,就好象画图一样,但要做网站,还是要用Dreamware. 在PS里设计好网站的效果图,尽量画漂亮点,然后将图切片,切片也要有技巧的哦,不然做出的网站容易变形.切好片就导出为HTML网页,用Dreamware打开这个网页,将里面的图片该作背景的作背景,留白的地方把图片删除了,节省资源,加上一些其他的东东,如:文字,超连接,动画这些,保存就可以了.

三穗县17373933479: 美工一般进行网页设计是使用Dreamweaver搭页面做还是用photoshop切图来做的? -
错贷复方: 按照我10多年的经验:先用Photoshop做页面设计,然后根据photoshop的切图,再进入Dreamweaver架构css+div页面.

三穗县17373933479: 如何用photoshop设计首页效果图 要详细的解答 越详细越好 -
错贷复方: 你得先了解网页的各个部分和结构,然后在把想好的样子用ps表现出来.比如分辨率要72的,宽度的话我现在做的是960或者980像素的.文字的话一般都是宋体的12px,14px.有时候也用微软雅黑的字体或者黑体,基本上网页的字体也就那么...

本站内容来自于网友发表,不代表本站立场,仅表示其个人看法,不对其真实性、正确性、有效性作任何的担保
相关事宜请发邮件给我们
© 星空见康网