岸谷的生活

我的日历
友情链接
访问计数
最新评论
获取RSS
我的 Blog:
pixer 最新的 20 条日志
[轨迹]
[银粉蝶]
[山石]
全站 Blog:
全站最新的 20 条日志

网页制作速成大法

Author: PublishTime:2006-1-3

马上就要交网页设计的作业了,短短的几节课之后要做一个网页出来确实有点难。做为华中大在线的一员,理应在这种危急关头挺身而出,指明一条捷径,让同学们不再郁闷。遂成此教程。

本教程撇开繁琐无趣的代码,只为提供一种简单有效的制作网页的思路,很多细节省略了,大家有任何疑问留言即可。

言归正传。

第一步,打开ps,新建一个宽780高随意的画布。

第二步,在此画布上按照你预先设想的那样画出网页。我在这里画了一个最简单的网页,不过有图形有文字有链接。

第三步,选择在视图里面打开标尺,根据页面的布局拉出一条条的辅助线。辅助线都是横平竖直的,网页就是这个样子,四四方方的一块块拼起来的,所以最开始画网页的时候要注意这一点。

第四步,根据拉好的辅助线切图,注意最下面的版权信息的背景我只切了一个像素,因为在html里面背景会自动填充的,所以不必切很多出来。

第五步,把这些切片命名,然后再"文件"里面点击"另存为网页"

第六部,在弹出来的对话框中按住shift选择你需要的切片,保存类型中选择"只保存图片",点保存。此时你保存的地方出现了一个images文件夹。

第七步,打开dreamweaver,新建一个基本页。

第八步,根据页面的结构建一个表格,输入相应的数值,这里我的页面时三行两列的结构,因此我新建一个三行两列宽为780px的表格,其他值为0。

第九步,因为第一行和第三行实际只有一列,所以我按住ctrl把它们的两列合并为一列。在第一行点击图像按钮插入图片。

第十步,把第二行左边这一列的宽度设为202px,右边设为780-202=578px.左边这一列中插入一个表格宽202px边框0,我插入的是一个8行一列的表格,我要在这放置八个按钮。在每一行中插入先头切好的按钮图片。

第十一步,分别点击每一个按钮,给他加上链接,如图所示。

第十二步,在右边这一列中直接输入文字并排版。

第十三步,在最下面这一行插入背景,如前面所说的,它自动填充了一整行。然后在上面直接输入版权信息。

第十四步,网页做好了,保存即可。

分类于:银粉蝶

全部分类中有 1 篇日志 | 每页显示 1 篇

 

Powered by pixer