PSD网页模板使用教程
来源:互联网 发布:java web 2016就业 编辑:程序博客网 时间:2024/04/30 05:14
鉴于很多朋友问到如何切图这个问题,又鉴于这个问题可大可小,一两句话是绝对讲不清楚的,所以今天有空闲在家里就举一个简单的例子来说明这个问题吧!OK,让我们开始:
step1:在PhotoShop中打开设计稿,选择工具板上的slice切片工具,先大刀阔斧的切上一番!技巧: 大面积的色块单独切成一块,尽可能的保持在水平线上的整齐(这个问题你们在后面的制作页面中深有感触)切好的图如下所示:
step2:在PhotoShop中选择file-save for web...来输出,这里要注意一些参数的选择:
我们来看看红线所标识的1,2,3部分,将1所示的切片工具选中,然后点选2所示的图片,在3所示的地方选择色值,如果色彩单一可以选择尽量小的色值位;(为什么要这样??)答案:这样会大大减小文件的大小,同时又能比较好的保持图片的色彩;设置好后点OK输出文件,这里的文件包括了一个htm和images文件夹,如图:
这里候你的页面才算完成了一半,接下来在Dreamweaver里建立站点:
step3:定义站点:
在图示左边的site name中为站点起一个名字,如example
然后在下面的local root folder中选择我们刚才导出的站点所以的文件夹;站点建好后在site map中我们看到:
(为什么要建立站点?)建立站点可以使我们养成一种很好的习惯,就是把一个网站所包含的文件,文件夹有条理的放在一起,同时我们很容易的将这个站点移动到其它地方而不用对文件路径进行任何改写!(当然如果你实在不想建立站点也没人强求你,我在事际工作中就遇到这样的同事,没有习惯为页面建立站点,当然后果的要麻烦少少了)
最后在下面一行插入一个三行二列的表格,并将图示中1,2外分别合并:
最后得到的页面应该是这样的:
好了,现在我们的任务就是往表格里面加图加内容了!这里就不再赘述了!(其实已经赘述得够多了!)
还要提醒大家注意的是在加图片和内容时,表格单元格的align,valign这两个属性非常重要,要不遗余力的运用它们来帮你做事!OK,自己实践一下!
- PSD网页模板使用教程
- PSD网页模板怎么用?
- PSD网页切图制作HTML全过程教程
- PSD网页切图制作HTML全过程教程
- 【WPF】使用PSD模板制作巨漂亮的ToggleButton --- 上篇
- 【WPF】使用PSD模板制作巨漂亮的ToggleButton --- 中篇
- 20个高品质和免费的网页模板PSD组合
- 分享20款免费和创新的 PSD 网页设计模板
- iPad Air PSD设计模板
- 网页设计后PSD时代(Post-PSD Era)
- 【网页--HTML使用教程】
- django模板使用教程
- PSD模版如何变成网页模版
- 素材---免费PSD网页界面设计素材六
- 素材---免费PSD网页界面设计素材五
- 素材---免费PSD网页界面设计素材四
- 素材---免费PSD网页界面设计素材三
- 素材---免费PSD网页界面设计素材二
- RFC821 简单邮件传输协议(SMTP)中文定义文档
- YetAnotherForum开源论坛使用备忘
- 米国学者说了一下地震原因
- Fatal error: Allowed memory size of 8388608 bytes exhausted (tried to allocate 775920 bytes) 问题解决
- 使用XDE模式进行模型驱动开发:案例研究
- PSD网页模板使用教程
- Delphi操作Excel大全
- .NET 2.0 Webbrowser 一些用法
- 笑话集合(持续更新中)
- 将Html原码解析成IHTMLDocumet对象,然后使用DOMNode将html显示成一棵树
- MDX 中 Sum()的使用
- Castle 开发系列文章
- 感动
- C#2.0匿名委托