网页设计制作教程

2022-08-04

第一篇:网页设计制作教程

网页设计制作教程

教你怎么设计制作网站

首先,可以告诉想设计制作网站或想从事网站制作相关行业的的朋友。做网站有很多种方式,不外乎自己开发,找人开发。找人开发这里就不说了,没有什么技术含量,准备好钱就可以了,自己做网站主要有下面两种方式:

做网站方法一(目前主流方式)

下载专业的网站内容网站管理来做,互联网发展到今天,做网站也变得非常简单和编辑,国内也出现了一批很专业的专门用于做网站的网站管理系统,比如pageadmin系统、shopex系统、discuz系统、worpress系统等都是很优秀做网站的程序(程序到官方网站下载,大家自己百度搜索),有的甚至支持多语言,多站点,总之有一句话说得好,站在巨人肩上会看的更高,一样道理,用专业的网站系统来做做网站就是一个非常省力,省时的过程,国内很多网站90%都是基于这些专业系统基础上搭建,当然,选中一个系统后你需要去熟悉这个系统功能你才能运用得很好,一般来说这些系统都不需要你具备专业的知识,只需要花几天时间看看教程就可以熟练运用并建站。

做网站方法二(专业人员必看) 这个也是本本要重点讨论的,这也是一个专业做网站人员必须掌握的方法,因为掌握下面基础,即使你用方法一来做网站,也能运用得更好,因为一把好剑也需要一个好的剑客。下面讨论一下成为一个网站从业人员必须掌握的知识:

第一阶段:开始时最好是学些图像编辑软件和基础网页脚本语法。 常用图片处理软件:Firework或photoshop 基础语法:HTML语法(百度一下:HTML入门),CSS语法(百度一下:CSS入门),javascript语法(百度一下:javascript入门),学好这些语法可以使您更了解网页制作的原理。结合教程边学习边练习,这最多花你几周时间。

第二阶段:有了上面的基础,你可以做一些简单的页面了。当然为了让网站做得更漂亮,功能更强大,你就需要学一些动态编程语言,常用的有ASP,PHP和ASP.NET,推荐后两种,因为Asp已经被淘汰,后两种程序区别自己上网搜索吧,本人更倾向于学习.NET,面向对象,功能太强了,微软的东西就是强悍。

第三阶段:结合你自己已掌握地知识来开发一些网站,比如自己开发一个简单企业网站,当你可以独立完成一个网站项目时候,你已经成为一个合理的网站建设人员了。

上面我们制作测试网站可以在自己电脑安装iis和对应软件(如php环境和asp.net环境)来运行并测试,网站做好了需要发布到网上给所有人浏览,我们就需要做下面几步:

1、申请域名,就是注册一个网址。

2、购买网站空间,有称为虚拟主机,用来放网站程序文件。

3、网站备案

国家要求国内任何一个网站必须进行工信部ICP备案,这个可以让你主机商给你代备案,一般都是免费的,你只需要提供资料给他们就可以。

做网站的流程大概就是上面几步,希望对大家有所帮助。

第二篇:网页设计与制作教程-第三次测试答案

1、以下关于FLASH为补间动画分布对象的描述中,正确的是( )。(A) A、用户可以快速将某一帧中的对象分布到各个独立的层中,从而为不同层中的对象创建补间动画 B、每个选中的对象都将被分布到单独的新层中,没有选中的对象也分布到各个独立的层中

C、没有选中的对象将被分布到单独的新层中,选中的对象则保持在原来的位置 D、用户可以快速将全部帧中的对象分布到各个独立的层中,从而为不同层中的对象创建补间动画

2、在FLASH中,执行“视图=〉隐藏边缘”命令的作用是( )。(A) A、隐藏被选择对象的突出显示状态 B、隐藏被选择对象的外框轮廓 C、隐藏被选择对象的填充区域

D、隐藏被选择对象的线条

3、以下关于FLASH逐帧动画和补间动画的说法正确的是( )。(B) A、两种动画模式Flash都必须记录完整的各帧信息 B、前者必须记录各帧的完整记录,而后者不用

C、前者不必记录各帧的完整记录,而后者必须记录完整的各帧记录 D、两种动画模式Flash都不用记录完整的各帧信息

4、在FLASH中,分离操作不会对被分离的对象造成以下后果( )。(D) A、切断元件的实例和元件之间的关系

B、如果分离的是动画元件,则只保留当前帧

C、将位图图像转换为填充对象 D、将位图图像转换为矢量图形

5、在Flash的MP3 压缩对话框中的音质选项中,如果要将电影发布到 Web 站点上,则应选( )。(C)(A) A、中 B、最佳

C、快速 D、无所谓

6、在FLASH中,关于导入PNG格式文件,下面说法错误的是( )。(B) A、导入为电影剪辑,并保留原有层表示将PNG 文件导入为电影剪辑,它所包含的所有帧和层都将出现在电影剪辑元件内

B、导入到当前场景的新层表示将PNG 文档导入到当前Flash 文档单个的新层中,该层将位于所有层的下面

C、如果要将 Fireworks 的 PNG 文件导入为单个的图像,则可以选中作为单个扁平化的位图导入复选框

D、如果选中可单个扁平化的位图导入复选框,所有其他选项都不可用

7、下面关于从浏览器打印电影和从Flash 播放器打印电影的说法错误的是( )。(D) A、从Flash播放器打印电影,可以指定Flash电影中的哪些帧可以被打印 B、从Flash播放器打印电影,可以确定帧的打印区域

C、从Flash播放器打印电影,可以给电影剪辑中的打印帧附加Print 动作

D、从浏览器打印电影肯定比从Flash播放器打印电影效果好

8、在FLASH中,两个关键帧中的图像都是形状则这两个关键帧之间可以创建的补间动画是( )。(C) A、运动补间动画

B、位置补间动画 C、形状补间动画 D、透明度补间动画

9、在FLASH中,对于那些具有复杂颜色效果和包含渐变色的图像,例如照片,最好使用那种方式进行压缩( )。(A) A、JPEG压缩 B、无损压缩 C、有损压缩 D、都不可以

10、以下关于FLASH帧锚记和注释的说法正确的是( )。(D) A、帧锚记和注释的长短都将影响输出电影的大小

B、帧锚记和注释的长短都不影响输出电影的大小

C、帧锚记的长短不会影响输出电影的大小,而注释的长短对输出电影的大小有影响 D、帧锚记的长短会影响输出电影的大小,而注释的长短对输出电影的大小不影响

11、在FLASH中,如果一个对象是以100%的大小显示在工作区中,选择工具箱中的“缩放”工具,并按下Alt键,使用鼠标单击,则对象在工作区中将显示的比例是( )。(A) A、50% B、100% C、200% D、400%

12、在FLASH中,如果要将FreeHand文档中的每一层都转换为Flash 电影中的关键帧应该是FreeHand导入设置对话框的( )。(B) A、层选项中选 Layers(层)选项

B、层选项中选Keyframes(关键帧)选项 C、层选项中选 Flatten(扁平)选项 D、没有这个功能

13、在FLASH中,使用钢笔工具创建路径时,关于调整曲线和直线的说法错误的是( )。(B) A、当用户使用次选工具单击路径时,定位点即可显示

B、使用次选工具调整线段可能会增加路径的定位点

C、在调整曲线路径时,要调整定位点两边的形状,可拖动定位点或拖动正切调整柄 D、拖动定位点或拖动正切调整柄,只能调整一边的形状

14、在Flash的测试模式中,不能以“列表显示对象”命令来显示的是( )。(C)(B) A、帧

B、电影剪辑的实例名 C、目标路径

D、对象类型(形状、电影剪辑或按钮)

15、在FLASH中,将舞台上的对象转换为元件的步骤是( )。(A) A、a.选定舞台上的元素 b.单击"修改〉 转换为元件",打开转换为元件对话框 c.填写转换为元件对话框,并点击确定

B、a. 单击"修改〉 转换为元件",打开转换为元件对话框 b.选定舞台上的元素 c.填写转换为元件对话框,并点击确定

C、a.选定舞台上的元素,并将选定元素拖到库面板上 b.单击"修改〉转换为元件",打开转换为元件对话框 c.填写转换为元件对话框,并点击确定

D、a.单击"修改> 转换为元件",打开转换为元件对话框 b.选定舞台上的元素,并将选定元素拖到库面板上 c.填写转换为元件对话框,并点击确定

16、当Flash 导出较短小的事件声音(例如按钮单击的声音)时,最适合的压缩选项是( )。(A) A、ADPCM 压缩选项 B、MP3 压缩选项 C、Speech 压缩选项 D、Raw 压缩选项

17、在FLASH中,设置电影属性时,设置电影播放的速度为12fps,那么在电影测试时,时间轴上显示的电影播放速度应该可能是( )。(B) A、大于12fps B、小于等于12fps C、等于12fps D、小于12fps

18、在Internet Explorer 浏览器中,来播放Flash 电影(swf 格式的文件)的技术是( )。(D) A、DLL B、COM C、OLE D、Active X

19、下面对FLASH将舞台上的整个动画移动到其他位置的操作说法错误的是( )。(D) A、首先要取消要移动层的锁定同时把不需要移动的层锁定

B、在移动整个动画到其他位置时,需要使绘图纸标记覆盖所有帧 C、在移动整个动画到其他位置时,对不需要移动的层可以隐藏

D、在移动整个动画到其他位置时,不需要单击时间轴上的编辑多个帧按钮 20、关于Flash影片舞台的最大尺寸,下列说法正确的是( )。(C) A、可以设置到无限大 B、1000px × 1000px C、2880px × 2880px D、4800px × 4800px

21、Flash 影片播放速率最大可以设置到( )。(C) A、99 B、100 C、120 D、150

22、在FLASH中,使用钢笔工具创建路径时,关于调整曲线和直线的说法错误的是( )。(B) A、当用户使用次选工具单击路径时,定位点即可显示

B、使用次选工具调整线段可能会增加路径的定位点

C、在调整曲线路径时,要调整定位点两边的形状,可拖动定位点或拖动正切调整柄 D、拖动定位点或拖动正切调整柄,只能调整一边的形状

23、在Flash中,单选钮的的初始状态是未选中的话,则( )。(B) A、initialState=TRUE B、initialState=FALSE C、initialState=YES

D、initialState=CHOOSED

24、以下关于FLASH按钮元件时间轴的叙述,正确的是( )。(B) A、按钮元件的时间轴与主电影的时间轴是一样的,而且它会通过跳转到不同的帧来响应鼠标指针的移动和动作

B、按钮元件中包含了4帧,分别是Up、Down、Over和Hit帧 C、按钮元件时间轴上的帧可以被赋予帧动作脚本 D、按钮元件的时间轴里只能包含4帧的内容

25、以下关于用FLASH制作形状补间动画,使用形状提示,能获得最佳变形效果的说法中正确的是( )。(B) A、在复杂的变形动画中,不用创建一些中间形状,而仅仅使用开始和结束两个形状 B、确保形状提示的逻辑性

C、如果将形状提示按逆时针方向从形状的右上角位置开始,则变形效果将会更好 D、确保形状提示的逻辑和效果

26、在FLASH中,默认时Flash影片帧频率是( )。(B) A、10 B、12 C、15 D、25

27、下面对创建FLASH蒙板操作的说法错误的是( )。(B) A、通过蒙板的小孔来显示的内容的层在蒙板层的下面

B、对于蒙板上的位图图像、过渡颜色和线条样式等,Flash都将忽略 C、蒙板上的任何填充区域都将是不透明的,非填充区域都将是透明的 D、在蒙板上没有必要创建有过度颜色的对象

28、在Flash中,用以绘制笔直的斜线的绘图工具是( )。(A) A、使用铅笔工具,按住Shift 键拖动鼠标 B、使用铅笔工具,采用伸直绘图模式 C、直线工具 D、钢笔工具

29、在FLASH中,下面关于导入视频说法错误的是( )。(C) A、在导入视频片断时,用户可以将它嵌入到Flash 电影中 B、用户可以将包含嵌入视频的电影发布为Flash 动画 C、一些支持导入的视频文件不可以嵌入到Flash 电影中

D、用户可以让嵌入的视频片断的帧频率同步匹配主电影的帧频率 30、在Flash MX中,要绘制精确的直线或曲线路径,可以使用( )。(B) A、铅笔工具 B、钢笔工具 C、刷子工具

D、油漆桶工具

31、下面关于打印Flash电影说法错误的是( )。(C) A、打印Flash 矢量图形时,可以在任意尺寸上获得清晰的打印效果 B、打印低分辨率的位图图像时,受到像素的影响 C、不可以从浏览器打印Flash电影 D、Flash 播放器的打印功能允许用户打印电影中的目录、联票、单篇、收据、发票或其他文档

32、以下关于使用FLASH元件的优点的叙述,不正确的是( )。(D) A、使用元件可以使发布文件的大小显著地缩减 B、使用元件可以使电影的播放更加流畅 C、使用元件可以使电影的编辑更加简单化 D、使用元件可以使编辑实例

33、在Internet Explorer浏览器中,是通过( )来播放Flash 电影(swf 格式的文件)的。(D) A、DLL库 B、COM程序 C、OLE对象

D、Active X插件

34、不同版本的Flash编辑文件(.FLA)是完全兼容的。(错)

35、在Flash中,分离操作会将被分离的对象由位图图像转换为矢量图形。(对)(错)

36、在Flash中,关键帧是指在动画中定义的更改所在的帧。(对)

37、在Flash中,一般来说逐帧动画文件量比补间动画小。(错)

38、作为发布过程的一部分,Flash 将自动执行某些电影优化操作。(对)

39、在Flash中,引导层是用层名称左侧的辅助线图标表示的。(对) 40、在Flash中,在制作电影时,背景层将位于时间轴的最底层。(对)

41、FLASH的工具箱一般放在屏幕的左边,由四个部分组成,它们分别是工具 查看 颜色 选项。(对)

42、在Flash中,引导层不出现在发布的 SWF 文件中。(对)

43、作为发布过程的一部分,Flash 将自动执行某些电影优化操作。(对)

44、在Flash中,可以在时间轴中排列关键帧,以便编辑动画中事件的顺序。(对)

45、在Flash中,为了在绘画时帮助对齐对象,可以创建引导层。(对)(错)

46、在Flash中,工具箱中选取颜色的工具是( )工具。(吸管)

47、在Flash中,执行“视图=》隐藏边缘”命令的作用是隐藏被选择对象的( )状态。(突出显示)

48、在Flash中,有两种类型的声音事件声音和( )声音。(流式)

49、在Flash中,如果一个对象是以100%的大小显示在工作区中,选择工具箱中的“缩放”工具,按下Alt键,使用鼠标单击,则对象将以( )比例显示在工作区中。(50%) 50、在缺省条件下,Flash影片播放的帧频率是( )帧/秒。(12)

第三篇:DW建站怎么制作设计网页终极教程

一、定义站点

1、 在任意一个根目录下创建好一个文件夹(我们这里假设为E盘),如取名为MyWeb。 ***备注:网站中所用的文件都要用英文名。

2、打开Dreamweaver,选择“站点—新建站点”,打开对话框。在站点名称中输入网站的名称(可用中文),在本地根文件夹中选择刚才创建的文件夹(E:web)。然后确定即可。 ***备注:再次打开Dreamweaver,会自动找到刚才设立的站点。如果有多个站点,可以在菜单“站点—打开站点”中去选择。

二、创建页面

1、在本地文件夹E:MyWeb下面的空白处,按右键选“新建文件”,这样就建好了一个页面,默认的文件名为untitled.htm。htm就表示这个网页文件是一个静态的HTML文件。给它改名为index.htm。

***网站第一页的名字通常是index.htm或index.html。其它页面的名字可以自己取。

2、双击index.htm进入该页面的编辑状态。在标题空格里输入网页名称,按右键选页面属性,打开“页面属性”窗口。在这里可以设置网站的标题、背景颜色或背影图像,超级链接的颜色(一般默认即可),其他都保持默认即可。

3.此时光标位于左上角,可输入一句话,如“欢迎来到我的主页”。选取文字,用菜单“窗口/属性”打开属性面板,选取文字大小为6,再使文字居中,然后在文字前用几个回车使其位于页面中间。

4.如要选取字体,则选择字体中的最后一项:编辑字体列表。然后在对话框中选+号,接着在“可用字体”栏中选择需要加入到字体列表中的一种字体,点击中间的按钮就可以加入了。 ***在网页上最常用的是宋体字。不要将特殊的字体加到列表中使用,因为别人电脑上未装就看不到。如果需要用的话,要做成图片后再使用。 ***在网页上打入空格的办法是:把输入法调为全角。

***在网页上换行的办法是:shift+Enter。只按Enter则为换段。

三、为页面添加图片

1、在本地文件夹E:MyWeb下面的空白处,按右键选“新建文件夹”,这样建立了一个文件夹,用它来放图片,可以改名为tu或pic或images都可以。

2、用菜单“窗口/对象”打开对象面板,点击“插入图像”,在对话框里选要插入的图片。如果会出现对话框:“你愿意将该文件复制到根文件夹中吗?”,必须选“是”,然后将它保存到刚建好的文件夹里。

3、选中该图片,打开属性面板,可以在上面为图片取名,重新设置图片的高、宽,拖住图片角上的点可以变大小。按住shift键,再拖动角上的点,可以使图片保持宽高比例拉伸。如要恢复这原始大小,则单击右下角的“重设大小”按钮。

4、 “链接”可以直接在这里输入地址。“替代”是图片的说明,即鼠标指向图片所显示的文字;“边框”是图片边框宽度,“对齐”是对齐方式。

四、添加超级链接

1、为文字添加链接。

比如,在页面上输入“我的文章”,然后将其选中,打开属性面板,在“链接”一格中,选择它所要链接到的页面即可。后面一格“目标”我们一般常用的是self即打开的新窗口代替了现开的窗口;或是选择blank即打开新窗口。

2、为图片添加链接

与上面文字的链接同理,插入图片,然后在属性面板中的链接一格中选择即可。 ****图片可以创建不同的多个链接。方法如下:

在属性面板中的“地图”一项下面有一些图形,比如点击方形,光标变成十字,在图片上画一个蓝色矩形的热区,此时在属性面板上可以为这个热区设置链接地址,鼠标指向会显示。同样,再用圆形设置一个热区,就可以再为该图片设置其他链接了。

3、添加E-mail链接

选中需要添加E-mail链接的文字或图片,打开属性面板,在“链接”一格中输入填写邮件地址。格式如下:mailto:邮件地址。注意中间不空格。

4、如果链接到浏览器无法打开的文件,例如exe、Zip等文件,那么浏览者在点击这个链接的时候,就会实现文件下载、或是在线播放的功能。

五、表格的使用

1、点击插入/表格,打开表格面板进行设置。行数、列数、宽度、边框等,“单元格填充”为单元格内侧与内容的距离;“单元格间距”为单元格之间的距离,单位均为像素。

2、插入表格后,在表格的边框上点击一下,可以全选整个表格。然后在下面的属性面板里可以进行各种设置。

3、把光标移到其中一个单元格,此时看到的属性面板,就是单元格的属性面板。也可以进行各种关于单元格的操作。如背景色、背景图、边框、合并、拆分等。

六、关于表格的其他操作 一制作细线表格 原理:

1、选中整个表格,设置其背景为黑色(该颜色即表格线的颜色)。

2、选中所有单元格,设置其背景为白色。 二自动格式化表格

1、先制作好一张表格,然后选中。

2、选菜单中的命令/格式化表格。即可以其中选择预设好的一些表格样式。 三一像素分割条

1、插入一个1行1列,宽为200像素,边框边距均为0的表格。

2、选中表格,设置表格高为1像素,并设置一个背景色(即所要的线条颜色)。

3、切换到代码和设计窗口,将代码 删除。

七、用表格构建完整的页面

一网页顶部(一般包括图标、广告、导航菜单)

1、创建一个1行2列,宽为760像素,边框及边距均为0的表格。

2、选中表格,设置排列方式为居中对齐,背景色为#3366CC。

3、将光标置于左边单元格中,设置其水平排列为左对齐,垂直排列为顶端对齐,然后插入一张图像,一般在此插入的是网站的图标,即logo。

4、将光标置于右边单元格中,设置其宽度为500,水平排列为居中对齐,垂直排列为中间,然后插入图像,一般是网页广告,即banner。

5、将光标置于刚完成的表格之后,插入/表格,创建一个1行1列,宽为760像素,边框及边距均为0的表格。

6、选中刚创建的表格,设置排列方式为居中对齐,背景色为#005173。

7、在该表格中依次插入多个图像,作为导航条菜单。

二网页中部(左边栏目列表、中间网站新闻、右边栏目列表)

1、 在导航条表格后面,插入/表格,创建一个1行3列,宽为760像素,边框及边距均为0的表格。并设置排列方式为居中对齐,背景色为#FFFFFFF。

2、 将光标置于左边单元格中,设置其宽度为18%,水平排列为居中对齐,垂直排列为顶端对齐,然后插入一张图像,插入一个导航条。

3、 将光标置于刚插入的图片后,插入/表格,插入一个12行1列,宽为90%的表格。设置其单元格间距为1,背景色为#CCCCCC。

4、 将光标放在表格第一个单元中,设置其高为20,背景色为#FFFFFF。插入/图像,插入一个导航文字前面的小点。同样设置其他11个单元格,这样左边的栏目分类列表就完成了。

5、 将光标置于主体表格的中间单元格中,设置其宽度为66%,水平排列为居中对齐,垂直排列为顶端对齐,然后插入/图像,插入一个导航条。

6、 将光标置于图像后,插入/表格,插入一个4行1列,宽为95%的表格。设置其单元格间距为1,背景色为#CCCCCC。

7、 将光标置于表格的第一个单元格中,拖动鼠标,将4个单元格都选中,设置高为60,背景色为#FFFFFF。

8、 将光标置于主体表格右边的单元格中,设置其宽度为16%,水平排列为居中对齐,垂直排列为顶端对齐,插入/图像,插入一个导航条。

9、 将光标置于图像后,插入/表格,插入一个7行一列,宽为90%的表格。设置其间距为1,背景色为#CCCCCC。

10、按住Ctrl键,用鼠标点击刚插入的表格的第

1、

3、

5、7单元格,然后设置它们的高为55,背景色为#FFFFFF。

11、选中第

2、

4、6单元格,设置其高为6,背景色为#FFFFFF。

12、切换到源代码窗口,将第

2、

4、6单元格中的空格符号“ ”删除。 三网页底部(一般包括版权信息及其他相关内容)

1、 将光标置于主体表格后,插入/表格,创建一个2行2列,宽为760像素,边框及边距均为0的表格。

2、 选中表格,设置排列方式为居中对齐,背景色为#3366CC。

3、 将光标置于表格第1行的左边单元格中,设置其宽度为50%,水平排列为默认,垂直排列为基线,背景色为#FFFFFF,然后输入版权信息,内容颜色随便。

4、 将光标置于表格第1行右边单元格中,插入/图像,插入一个圆角图像,在它后面输入Email字样,设置其大小和颜色为1和#FFFFFF。

5、 插入/表单对象/文本域,插入一个文本域,宽度可以随意。

6、 插入/图像,插入一个GO的图像。

7、 设置页属性。点击菜单修改/页面属性,在标题一栏中输入标题,并选择背景图像,将顶部边界设为0。

***将整个网页分部分放到不同的表格中组合而成,还可以加快浏览器读取页面的时间。;因为浏览器是读完整个表格后才显示内容的,所以最好不要框在整个一个表格中。

八、用布局表格构建完整的页面

1、 单击插入/布局,里面的布局视图按钮,就切换到布局视图状态(默认为标准视图)。也可以用菜单里的查看/表格视图/布局视图来进入。

2、 先单击绘制布局表格按钮,然后在页面中像绘图一样创建出布局表格。

3、 就像上一个例子一样,先绘制好网页的顶部,再中部,再底部的大表格。

4、 再单击绘制布局单元格按钮,然后在已经绘制好的布局表格中,再绘制布局单元格。

5、 返回到标准视图,在已经划分好的表格里,再插入嵌套的小的表格,把页面再细化,就可以完成整个页面的设计了。

****注意把整个页面都放在一个大的布局表格中,因为这样的网页浏览速度会很慢。应该按照页面的版面和内容划分出几个布局表格,然后在其中分别插入布局单元格。

九、层的使用

1、点击插入/层。也可以点击图标,然后拖动鼠标创建出一个层。

3、选中创建的层,看属性面板。“层编号”和“标签”都使用默认即可。“层编号”是编程时需要用的,我们现在一般不用。“上”即距页面上边界的距离;“左”是距左边界的距离。“z轴”是层的顺序,数字大的叠加在数字小的上面。 ****如不设置颜色时,层是透明的。

4、点中层左上角的小方框可以随意拖动层,大小也可以调节。

5、“溢出”一栏中,当文字多于层的大小时,visible(超出的部分照样显示)、hidden(超出部分隐藏)、scroll(不管有否超出,都显示滚动条)、auto(有超出时才出现滚动条)。

6、点击菜单窗口/其他/层,此时将出现层管理窗口。可以在其中修改层的名称和Z轴值,也可以点击眼睛图标使层可见或不可见。还有一个防止重叠的选项。

7、层的对齐。按住shift键,同时选中几个层。然后用修改/对齐,用这里的选项。

8、嵌套层。⑴首先在文档中插入一个层。⑵将光标置于该层内,然后继续插入一个层,就得到了嵌套层。⑶里面的叫子层,外面的父层。它们的Z轴顺序是一样的。拖动父层时,子层也会相对移动。移动子层时,父层不会随之移动。

十、了解时间轴

1、点击菜单中的插入/层,插入一个层。

2、在层中插入图片,如一张飞机的图片。(这里的图片也可以是一张小动画的.gif图像)

3、点击菜单中的窗口/其他/时间轴,打开时间轴窗口。

4、选中页面上创建的层,用鼠标按住层左上角的小方框图标,将层拖放到时间轴的第1帧中。这时自动创建了一个长度为15帧的时间轴。

5、选中时间轴上的第1帧,将页面中的层拖放到页左上角,即动画开始时的位置。

6、选中时间轴上第15帧,可以拖动该帧至任意长度,如30帧。

7、选中第30帧,将层拖放到页面的右下方,此时窗口中显示出层从第1帧到第30帧的运动轨迹。(此时运动为直线)

8、可以点中第15帧,右键选“增加关键帧”,在选中第15帧的状态下,拖动层到页面中下方。

9、勾选“自动播放”项。 十

一、制作滚动公告牌

1、在页面上插入一个层,然后为层设置一个背景,作为公告版的框架。

2、然后在创建的层中插入嵌套层,将嵌套层移动到父层的下方。

3、在嵌套层中输入文本,并将其居中排列。

4、打开时间轴面板,将子层作为对象添加到面板中。

5、为子层创建一个向上移动的路径,将其移动到父层的上方。

6、拖动最后一关键帧,增长动画时间,然后勾选“自动播放”和“循环”两项。

7、选定父层,在其属性面板中将“溢出”属性设置为“hidden”。 十

二、在页面中运用flash动画

1、点击插入中的Flash按钮,即可为页面插入一个动画。也可以选菜单插入/媒体/Flash来完成这一步。

2、选中已插入的动画,看属性面板。这里可以设置它的宽、高,也可以通过拖动来改变大小。

3、可以在这里点击“播放”来预览动画。 十

三、让插入的flash动画变透明

1、当网页上已经有背景,或是想要在一张图片上再插入flash动画,而flash动画本身也有背景色,所以会影响美观,这时我们要把它做成透明动画。

2、如在页面上插入一张图像。

3、在图像上插入一个层,在层中插入好所需要的flash动画。

4、选中flash动画,在属性面板中点击“参数”按钮。

5、在“参数”的左面一格输入“wmode”。在右面“值”一格输入“transparent”。 十

四、在页面中播放声音

1、在完成全页面以后,如果要为该页添加背景音乐,注意背景音乐一般是*.midi文件,这样的声音文件十分小,易于快速下载,其他格式不适合作为背景音乐。

2、在页面中所有表格之外,(注意此时编辑窗口左下方的标签选择栏中仅显示这一项,或是在左下角点一下,这样才能保证这个行为是添加在整个页面上的)。点击行为窗口上的“+”按钮,(或用菜单 窗口/行为,打开行为窗口。)

3、从弹出菜单中选择“播放声音”。打开一个对话框。

4、在这个对话框里用“浏览”选择要播放的声音,并确定。

5、这时行为面板上自动显示了事件为onload,动作为播放声音。点击这一行,中间出现一个按钮。点击按钮,可以设置这个声音在什么事件下播放。可以选择“显示事件”/“IE5.0。

6、我们常用的如Onload(当页面载入时)、OnClick(单击鼠标)、OnMouseOver(鼠标移到对象上)、OnUnload(当关闭页面时)等。

7、该行为也可以设置在图片上、文字链接上。在文字链接上播放声音之前,先为文字添加一个空链接,即选中文字,在链接一格里输入一个“#”符号。

十五、弹出窗口

1、首先制作一个准备在小窗口中显示的页面(比如a.htm),由于这个弹出窗口不能太大,所以内容要少一些。

2、打开一个制作好的页面,把光标移到页面中所有我表格以外,点击行为窗口上的“+”按钮,从弹出菜单中选择“打开浏览器窗口”一项。

3、在对话框中里输入相应的设置。要显示的URL即a.htm,窗口宽度和高度自己定,单位为像素。属性中的各项参数需要就打勾。

4、设置完毕后,点“确定”。此时行为窗口中将显示打开浏览窗口这个行为,触发条件为Onload,如果不是要这项,就自己设置。

5、该行为也可以设置在图片上、文字链接上。。

6、可以用这个方法来表示对浏览者的打开时的欢迎、网站公告、离开时的告别语等。 十

六、控制状态栏信息

1、打开页面,选中一张图片。

2、点击行为窗口上的“+”号按钮,选择设置文本/设置状态条文本。

3、在对话框里的“消息”一栏里,输入需要显示的话,如对这张图片的介绍。

4、可以设置行为的触发条件为OnMouseOver(鼠标移到对象上),这样当鼠标经过这张图片的时候,状态栏将出现相关的信息。

5、如果需要鼠标在移开后,这个信息消失,那么再次使用这个行为,在“消息”一栏里什么都不写,然后把触发条件改为OnMouseOut(鼠标移开)。

6、同样可以在一段文字上设置该行为。或是设置在整个页面上也可以。 十

七、弹出信息

1、打开一个制作好的页面,点左下角项。点击行为窗口上的“+”按钮,从弹出菜单中选择“弹出信息”一项。

2、在设置窗口中“消息”一栏里输入想显示的消息即可。

3、触发条件设置为Onload(当页面载入时),就可以用来作为打开页面的欢迎信息。如设为OnUnload(当关闭页面时),就可以作为用户关闭页面时送别信息。

4、也可以在某一段文字上设置弹出信息。比如一段文字不愿让人复制,就选中整段文字,注意此时左下角显示〈P〉,即段落。

5、然后同样操作,消息可以输入版权之类的语句。只是设置触发条件为OnBeforeCopy(按右键时触发),或OnCopy(按右键选复制时触发)。 十

八、动态图片按钮

1、准备好两张同样大小的图片,常用的方法是如一张为灰度照片,一张为彩色照片。或一张是按钮凹下的样式,一张是按钮凸起的样式。

2、举例:插入一个3行1列的表格,设置宽度为180像素。

3、将光标置于第一行,插入一张灰度的图片。

4、在属性面板中“链接”一栏里输入需要链接的地址,并给图片加上名称,如tu1.

5、点击行为窗口上的“+”按钮,从弹出菜单中选择“交换图像”。

6、此时在“图像”一栏中已显示要交换的图像,然后在“庙宇原始档为”一栏里选择好交换后的那张图。

7、下面有两个参数,“预先载入图像”和“鼠标滑开时恢复图像”,都要选中。

8、同样方法创建另外两个动态按钮。

十九、用框架布局页面

框架由两个主要部分组成——框架集和单个框架。

1、 点击插入中的框架,即显示出已定义的13种框架的样式。我们上—中—下结构为例。

2、 点击“上—中—下”框架结构的图标,此时在页上插入上下两个框架,将整个页面分割成了3部分。我们分别在上面输入“上”,在中间输入“中”,在下面输入“下”。

3、 先保存一下。点击菜单中的文件/保存全部。这时首先保存框架集文件,可以自己修改名字,如kuangjia.htm。然后将分别保存框架集中的其他页面。在保存对应的页面的时候,该部分会以虚线框起来,这样可将上面部分保存为shang.htm。下面部分保存为xia.htm。中间部分保存为zhong.htm。

4、 至此,我们保存了四个页面,分别是框架集,和组成框架集的上、中、下三个页面。所以,其实这个框架是由四个页面组成的,所以用框架会降低一点用户浏览的速度。

5、 点击窗口/其他/框架,打开框架的面板。在这里单击某个框架,即可选中该框架。当框架被选中时,编辑窗口中对应的框架出现虚线。

6、 如:选中上面topframe,此时属性面板上显示的是上面这个框架的属性。同样选中中间框架和下面框架,也可以分别设置它们的属性。

7、 在编辑窗口中,将鼠标放在两框架之间的边框上,光标将变成上下箭头形,此时点击边框,选中的是整个框架集。

8、 此时属性面板上出现的是整个框架组的属性。可以在此设置框架集是否有边框、宽度及颜色等。不过最为重要的是可以在这里设置框架集中各个框架的大小。

9、 在属性面板的右面的图示上选中上面框架,设置它的行为80像素,边框为0。

10、选中下面框架,设置行高为30像素,边框为0。

11、选中中间框架,设置行高为1,单位为相对。(相对的意思是:当前行相对于其他行所占的比例。设为1就是指占据除上和下以后的所有浏览窗口剩余空间。

12、举例:将光标置于上面框架topFrame上,右键选页面属性,设置背景色为#FF6600。然后插入/表格,插入一个1行2列,边框边距都为0的表格。设置第1个单元格的宽度为116像素,然后插入一张图片。将第2个单元格设置为水平对齐方式为居中,垂直排列方式为底部,然后依次输入“狮子座”、“魔蝎座”、“双子座”字样。

13、将光标置于中部框架mainFrame中,右键选页面属性,设置背景色为#FFFFCC。然后插入一张大图像。

14、将光标置于下面框架bottomFrame中,右键选页面属性,设置一个背景图像。

15、另外做好三个页面,作为“狮子座”、“魔蝎座”、“双子座”所要链接的页面。

16、选中“狮子座”,在属性中为它设置好要链接的页面,然后在“目标”里选“mainframe”,即该内容在中间那个框架中显示。

17、同样设置“魔蝎座”、“双子座”的链接。 二

十、跳转菜单

1、 点击主菜单中的插入/表单对象/跳转菜单,也可以用插入/表单,中的跳转菜单图标,来调出跳转菜单设置窗口。

2、 首先在“文本”一栏里输入“请选择相关网站”字样。然后点击窗口上的“+”号按钮。这时菜单里多了一个选项,这个选项没有链接,仅作为跳转菜单的说明文字。

3、 在文一栏里输入需要的网站,如“新浪”,然后在“选择时,前往URL”一栏里输入网站链接地址http://,此时,菜单项一栏里又多了一个选项,这个选项对应一个网的链接地址。

4、 使用同样方法,在菜单中添加其他一些选项及对应的链接。还可以用“上”“下”的按钮,来调整它们的顺序。

5、 设置窗口的“菜单之后插入前往按钮”一项先不要选择。选中“更改URL后选择第一个项目”一项,这样当使用跳转菜单到某个页面后,如果返回到跳转菜单页面,此时页面中的跳转菜单默认显示的依旧是第1项内容。

6、 设置完毕后点击“确定”即可。

****因为跳转菜单是一个表单,所以其实是先插入了表单(红色虚线区域),然后在表单中再插入了下拉菜单。

7、 想修改选项,可以选中页面上的下拦菜单,此时点击属性面板中的“列表值”,即可修改各项内容了。

8、 当选中跳转菜单时,行为窗口中也出现行为。双击该行为,也可以进入设置窗口,可以重新对其进行设置。

9、 如果“菜单项”里的第一项就是链接,而不是上面所说的一句提示的话,那么就要选中“选项“中的“菜单之后插入前往按钮”。添加一个“前往”按钮。 二十

一、运用插件(Dreamweaver功能扩展)

1、 首先下载好需要的插件,此处举例用的是Animate Browser Window。这是一个动态改变窗口的大小的插件。打开Dreamweaver Extension Manager,安装下载好的插件。

2、 启动Dreamweaver,在做好的页面上,右击左下角〈body>,然后点击行为窗口中的“+”号按钮,在其中选择“Animate Browser Window”,然后在其中做相应的设置。这里设置窗口打开之前高宽均为0,打开后为填满屏幕。触发条件为onLoad。 二十

二、滚动字幕

1、把光标插入点放在需要插入滚动字幕的地方。

2、点击插入面板的“标签选择器 ”。

3、选择 marquee标签,点击“插入”按钮。然后关闭“标签选择器 ”。

4、转换到代码视图。把光标插入点放在 两个marquee标签之间。

5、选择“窗口”/“标签检查器”。可以在“标签检查器”中设置标签的各种用法。

6、点击behavior设置项右边的下拉箭头,选择滚动字幕内容的运动方式。其中三个选项意思分别是:Alternate:内容在相反两个方向滚来滚去。Scroll:内容向同一个方向滚动。Slide:内容接触到字幕边框就停止滚动。

7、direction属性设置字幕内容的滚动方向。四个选项意思为:down:向下运动。Left:向左运动。Right:向右运动。Up:向上运动。

8、scrollamount属性设置字幕滚动的速度。一般设为1。

9、scrolldelay属性设置字幕内容滚动时停顿的时间,单位为毫秒。如果要让滚动看起来流畅,数值应该尽量小。实例中设置为1毫秒。

10、width属性设置滚动字幕的宽度。这个任意,比如设置为300。

11、onMouseOver事件设置鼠标移动到滚动字幕时的动作,常设置为停止滚动。onMouseOut事件设置鼠标离开滚动字幕时的动作,常设置为开始滚动。这个两项不能选,只能手工输入。在onMouseOver后面输入“this.stop();” 在onMouseOut后面输入“this.start();”

12、style属性设置字幕内容的样式。实例中设置字幕文字大小,也要手工输入“font:12px;”。

13、loop属性设置字幕内容滚动次数,默认值为无限。“-1”也为无限。

14、全部代码:滚动字幕内容 二十

三、创建CSS样式表

1、在网页上输入一些文字。

2、打开“CSS样式”面板,也可以用“窗口/CSS样式”打开。

3、面板下方有四个按钮,分别是附加样式、新建样式、编辑样式、删除样式。

4、点击“新建样式”,打开对话框。输入名称,注意名称前有一个点号。如取名为.zi(中文名不行)。类型:创建自定义样式,定义在:仅对该文档。

5、此时再打开一个对话框,在左边的分类里选择“类型”,然后在右面设置字体为宋体,大小为14像素,颜色任意。然后确定。

6、选中页面上的文字,然后点击窗口里的样式.zi。此时这段文字就应用了CSS样式。

7、如要对刚才定义的CSS样式进行修改,可以点中它,然后点下面的编辑样式按钮。 二十

四、创建动态链接样式表

1、点击“新建CSS样式”对话框,在“定义在”一栏选择“仅对该文档”,在“类型”一栏里选择“使用CSS选择器”。

2、当样式表类型选择“使用CSS选择器”时,下拉菜单的名字变成了“选择器”,表示输入内容为CSS选择符,单击下拉按钮,可以看到动态链接的4种状态。 a:link——超级链接的正常状态; a:visited——访问过的超级链接状态。

a:hover——光标移至超级链接上时的状态; a:active——选中超级链接的状态。

3、 接下来对这几种状态分别设定,首先从下拉菜单中选择a:link,点击“确定”按钮后弹出样式表设置窗口,设定该样式无下划线,颜色为#FF6600(橙色)。

4、 用同样方法设定a:visited,设定其为无下划线,颜色为#FFFF00(黄色)。

5、 接下来设定a:hover,设定其为有划线,颜色为#FF6600(橙色)。

6、 a:active不用设置,它会自动依照a:hover而定。

7、 在网页上输入一句话,在属性面板中设定它的链接为“#”。即可。

****注意:必须按照这样a:link、 a:visited 、a:hover 、a:active的顺序来设置,否则不会出现预期的效果。

如果我们需要一个页面上有两个或更多的链接效果,可以用以下方法:

1、 点击新建样式按钮,样式类型选“使用CSS选择器”,在“选择器”一栏里,直接输入a.link2:link,接着设置a.link2:link为红色无下划线。

2、 继续定义下面两个样式。名称都直接输入,分别设定它们为a.link2:visited,紫色无下划线。 a.link2:hover,蓝色有下划线。

3、 此时在“CSS样式”选项下多了一个名称为link2的自定义样式。

4、 在页面中输入一段话,为它添加一个#链接,选中这个链接,然后点击样式表窗口中的样式link2,将此样式应用在该链接上。

5、 同样方法可以制作同一页面上的不同链接格式。

****为保持一种风格,同一页面上不宜建立过多的链接样式。 二十

五、外部样式表

***在不同的页面中应用相同的样式表。

1、 新建样式表,取名,然后类型选“创建自定义样式”,定义在选“新建样式表文件”。

2、 确定后,打开保存外部样式表的窗口。然后把它保存到本地站点中即可。

3、 此时,可以看到样式表窗口中新增了一个样式表文件,文件的后缀名为css

4、 如果当前页面中的一个内部样式表要导出为外部样式表文件,以便供其他页面使用,可以点击样式表窗口右上角的灰色的图标,选“导出样式表”,此时可以为样式取名和保存为一个外部文件。

5、 当其他页面需要使用外部样式表时,可以点样式表窗口中的第一个按钮“附加样式表”,打开窗口,然后选择外部样式表文件,在添加为里选“链接”,确定即可。 二十

六、其他CSS ****CSS里的背景,是设置文字背景、表格背景图等。

****CSS里的区块,是指设置文本的文字间距、对齐方式、下标、上标、排列方式等。 ****CSS里的盒子,是指设置图片和文本内容之间的空白距离,以及图文混排的方法。 ****CSS里的边框,是指设置表格文本区、按钮等的美化。

****CSS里的列表,是指设置列表项样式。即那种提纲式的一段话。 ****CSS里的定位,是指设置页面中图片的相对和绝对定位。

****CSS里的扩展,其中的光标,可以设置光标的样式,可以设置为hand(手型)、crosshair(十字型)、text(“I”型)、wait(等待型)、default(默认型)、help(帮助型),还有各种方向的箭头型。

****CSS里的扩展,其中的过滤器,可以用来做CSS滤镜特效,即用来加工图片的透明、发光等。但效果不太明显,还是用专门加工图片的软件来完成比较好。

二十七、创建网上相册

1、 首先要安装好FireworksMX软件。

2、 加工好所需要放在网上的照片,把它们加工成一样大小,放在一个文件夹里。

3、 点击菜单中的命令/创建网站相册,打开设置窗口。

4、 输入相册标题,副标信息,其他信息(以后也可再修改)。“源图像文件夹”,选择刚才保存照片的文件夹。

5、 “目标文件夹”,单击“浏览”按钮选择当前站点目录。(即将照片全部保存到站点里来)

6、 “缩略图大小”一项,可以根据需要选择,“显示文件名称”一项,选中会在生成的相册中显示每个图片的文件名。

7、 “列”一格是每一行显示的图片数,默认为5,可以自己改动。

8、 下面两个“格式”一般都选“品质较高”。

9、 选中“为每张图片建立导览页面”一项。确定即可。 二十

八、定制网页过渡功能

*****网页过渡是指当浏览者进入或离开网页时,页面呈现的不同的刷新效果,比如卷动、百叶窗等。网页看起来会更具有动感,不过也要注意适可而止,否则太花哨的变化也容易引起浏览者的反感。步骤:

1、 打开一个页面,单击菜单中的插入/文件头标签/Meta,会弹出Meta对话框。

2、 在对话框中的属性选项的下拉列表中选HTTP-equivalent选项,在值一格中键入Page-Enter,表示进入网页时有网页过渡效果。

3、在内容一格中键入 Revealtrans(Duration=4,Transition=2),Duration=4 表示网页过渡效果的延续时间为4秒,Transition表示过渡效果方式,值为2时表示圆形收缩。

4、输入完后单击确定,存盘。这样当我们点击一个超链接进入这个页面时就可以看到效果了。

5、另外还有二十多种效供你选择,只要将Transition的值改为相应的效果的代号即可,具体效果和设置如下表所示

效果 Transition 效果 Transition 盒状收缩 0 溶解 12 盒状展开 1 左右向中部收缩 13 圆形收缩 2 中部向左右展开 14 圆形展开 3 上下向中部收缩 15 向上擦除 4 中部向上下展开 16 向下擦除 5 阶梯状向左下展开 17 向左擦除 6 阶梯状向左上展开 18 向右擦除 7 阶梯状向右下展开 19 垂直百叶窗 8 阶梯状向右上展开 20 水平百叶窗 9 随机水平线 21 横向棋盘式 10 随机垂直线 22 纵向棋盘式 11 随机 23 二十

九、库的应用

****网站中有些内容需要反复使用,比如自己制作的一个网站图标等,此时将这个组件存为在库里,可以随时调用。

1、 打开一个页面,选择需要保存的组件,比如一个图标。

2、 点击菜单窗口/资源,打开资源窗口。然后在其中选最下面一本书样的按钮,打开库面板。

3、 点击下面的新建按钮,就将刚才选中的图标保存到库里了,此时还可以给它取名。

4、 在一个新页面上要应用库里的内容时,打开库面板,选中需要用的图标,然后点击下面的“插入”即可。

十、用模板迅速完成站点(首页或内部某一页)

1、 首先规划好自己想要制作的网站,要把它的各项链接的内容都设计好。如我的网站: 首页上的链接有:网页版、动画版、请留言、关于我、联系我、许愿瓶

网页版上的链接有:站长简介¦ ¦教研论文¦ ¦课堂寻真¦ ¦原创课件¦ ¦心海撷贝¦ ¦留影人生¦ ¦给我来信¦ ¦雁过留声¦ 动画版上的链接与网页版相同。

以下再链接到各种文章或课件的页面。如“课堂寻真”链接到全是教案标题的页面,然后由每一个教案标题,再链接到放这个教案的页面。其他同理。

2、下载好比较适合自己规划的、所喜欢的网页模板,(模板网站比较好的如:http:// )一般它都包括两个文件:一个是index.htm,另一个一般是命名为images的文件夹,即我们所说的用来放置图片的。

3、定义好站点,然后将这两个文件(夹)复制到站点文件夹下。

4、双击index.htm文件,即进入首页的编辑状态。然后就可以修改这个页面让它符合自己的需要。这样即可完成首页。 三十

一、将已有的网页保存为模板

****用于在一个网站中有大量重复出现的页面时。(在新建和使用模板之前一定要定义好站点)

1、 选择某一页,点击文件/另存为模板,将当前页面保存为一个模板。此时打开了“另存模板”窗口,为该模板取名,然后保存。

2、 此时可以发现在站点中自动创建了一个名为Templates的文件夹,在该目录中存有我们保存的模板。其扩展名为.dwt

3、 这个模板目前在被运用时,是无法修改的。所以要设定模板的可编辑区域。

4、 比如,在当前模板页面中,需要让页面中间部分可编辑,这样使用模板时就可以在其中添加内容了。选中页面中间部分的表格单元格(按住CTRL键在单元格里单击),点击主菜单中的插入/模板对象/可编辑区域。此时会打开对话框,在其中为模板取名,然后确定。

5、 此时所定义的可编辑区域被浅蓝色线条框起来,并且左上角还有该区域的名称。将模板文件保存并关闭。

6、 点击主菜单中的文件/新建,在新建页面窗口中点击上方的“模板”选项。

7、 此时在“模板用于”一栏中列出了当前定义的站点,选中某个站点,在窗口中间一栏中显示的是该站点拥有的模板文件。选中某个模板,在“预览”一栏中可以预览该模板。然后点“创建”按钮,就新建了一个页面。

8、 在出现的新页中,除可编辑区域外,其他部分是不能进行修改的。 三十

二、上传自己的网站

1、 申请网站空间,然后将它上传到网上。目前基本上没有免费空间,免费空间也都需要放置广告,或是申请一个收费空间,它都会提供十天左右的试用期,可以作为网站测试来用一下。

2、 在点击申请后,会出现要求注册的表格,一般包括用户名、密码、邮箱、联系电话、省份、主页的名称、主页的类别、主页的简介等。

3、 全部填完之后,即可得到以下几项:①用户名(刚才填写)②密码(刚才填写)③FTP上传地址 ④主页地址(有时是将以上几项发送到所填写的邮箱)

4、 下载并安装FTP上传软件,可以用CuteFtp(昆山视窗/软件 可以下载,免费)

5、 打开CuteFtp软件,点击主菜单中的文件/站点管理器。

6、 在打开的对话框中填写好FTP上传地址、FTP站点用户名称、FTP站点密码,然后点击连接,就可以连接到站点服务器。(第二次打开就自动连接,不用再填写了)

7、 连接好以后,在页面上出现框架,左边为本地计算机上的文件,右边为远程计算机,只要将左边的文件(即做好的网站文件)一个个拖动到右边,即完成了上传。 三十

三、宣传自己的网站

如何让网站地址让别人知道,方法有二:

1、 用专门的软件,可以将网站登录到各大搜索引擎。

2、 手工登录。如打开百度(),在下面有个链接“网站登录”,点击后会被要求填写网站地址、名称、内容等,然后就被收入百度的搜索引擎了,这样别人就可以搜索到你的网站了。其他网站登录同理。

第四篇:网页设计教程

一、创建名为Test1的站点,并在其中按如下要求设计简单网页Index.html,如图所示。

要求:

①设置网页标题为自己的学号,网页背景为bj1.jpg;

②插入一个3行3列的表格,表格边框宽度为1;

③第一行合并单元格,插入动画dh1.swf;

④第二行第一列标题的格式为蓝色、楷体、24Px、居中,正文缩进两个汉字、大小为18Px、左对齐;中间插入一个图片tx1.jpg,其宽度为260、高度320;第三列是一个表单,其中姓名和密码的字符宽度和最多字符数为12;

⑤第三行的字体大小为18px;“友情链接”链接到http://;“动画世界”链接到本地的Flash.swf;“申请加入”链接到本地的Apply.html,在新窗口中打开。

④表格第二列中间三个单元格合并,插入一个图片文件“dx2.jpg”和文字,图片宽300、高160,左对齐;创建名称为C的CSS:蓝色、18Px、楷体,用于格式化文字。 (2)Apply.html网页设计要求∶内容为一个表单;包括:姓名、性别、职业。其中姓名最多输入8个字符,性别要求用单选按钮,职业用下拉框,值分别为“学生”、“教师”和“工程师”,默认选中“学生”。

三、教材内容

四、食品与营养

五、我的家乡

第五篇:网页设计与制作

《网页设计与制作》教学大纲

第一部分 大纲说明

一、课程的性质和任务

《网页设计与制作》是高等职业学校计算机专业的一门必修的专业基础课。本课程讲述了网站创建、网页制作基本知识、Dreamweaver网页制作集成工具使用的方法等内容。通过本课程的学习,使学生掌握构建网站的基本知识,熟悉网页开发平台的使用,能够独立的创建个人网站。

二、课程教学要求

1、理论和实践相结合

本课程是计算机专业的一门必修的专业课程,是理论和实践相结合的课程。该课程重点是构建网站的基本知识,,熟悉网页开发平台的使用,能够独立的创建个人网站。在教学过程中 要与Dreamweaver MX、Flash MX和Firework MX结合起来,同时,应该使课堂理论教学与学生参与专业实践相结合,在课外安排一定的时间进行专业实践,这样学生在学习中,通过理论学习和上机操作实验熟悉构建网站的流程,能够进行简单图像和动画的制作、加工和处理,能够独立的创建个人网站。

2、加强课堂练习与课后练习

为了训练和培养学生的实际操作能力,必须要求学生进行课堂练习与课后作业练习,加强学生的专业技能和基础理论的学习。

三、教学时数与教材

网页设计与制作课程教学总学时数为54学时,其中授课时间为32学时,实验课时为22学时;《网页设计与制作》,田博文编著,人民邮电出版社,2004年。

四、课程教学方法

在网页设计与制作的教学中应当注意:

1、教学方法

本课程应采用理论与实践结合,讲授与自学结合,实践操作与课堂讨论结合的“三结合”教学方法。

2、教学形式

1 本课程的教学形式可以采用班组教学、课堂讲授、利用业余时间自学等形式。

3、实践性环节教学要求

本课程具有较强的实践性和应用性,教学过程中应该贯彻理论与实践相结合的原则,有重点的组织一些课堂讨论和实践操作以及单元测试,督促并检查学生按时完成课外作业,有条件的情况下,可以组织学生到有关部门及单位参观、座谈、以增强学生的感性认识。

第二部分 教学内容和教学要求

第一章 基础知识(2学时) 教学目的与要求:

通过本章学习,学生应了解网页被执行的详细过程,以及与网络相关的基本定义和概念,并掌握在网络中建立网站的方法。

重点难点:在网络中建立网站的方法教学内容: 教学内容:

(一) 网络基础知识

(二) 初识网页

(三)网上安家

第二章 创建本地虚拟站点(4学时) 教学目的与要求:

通过本章学习,让学生熟练掌握在本地创建虚拟站点与创建文件和文件夹的方法,以及站点管理器的使用,了解制作网站的准备工作。 重点难点:创建虚拟站点与创建文件和文件夹的方法 教学内容:

(一)准备工作

1、了解网站的服务群体

2、确定网站的主题

2

3、 画出结构图

4、 确定网站命名规则

(二) 创建虚拟网站

(三)其他功能

1、 站点地图布局

2、 保存站点地图

3、 设计备注

第三章 文档、文本和链接(4学时) 教学目的与要求:

通过本章的学习,让学生熟练掌握创建、保存文档的方法,以及文本的各项参数设置和文本超级链接、图像超级链接、下载链接的使用方法,了解文本各项参数的源代码表示方法。

重点难点:创建、保存文档的方法,以及文本的各项参数设置和文本超级链接、图像超级链接、下载链接的使用方法 教学内容:

(一) 新建文档

(二)建立超级链接

1、 添加文本链接

2、 图像超级链接

3、 电子邮件链接

4、 下载链接

5、 命名锚记 第四章 Web图像(4学时) 教学目的与要求:

通过本章的学习,让学生熟练掌握在Dreamweaver MX中使用图像的一些基本方法和技巧、设置网页背景色和背景图像的方法、图像映射和跟踪图像的方法,了解GIF和JPEG两种图像格式的异同点和使用环境。

重点难点:设置网页背景色和背景图像的方法、图像映射和跟踪图像的方法 教学内容:

3

(一) 网页中的色彩

(二) 图像格式

1、 GIF格式

2、 JPEG格式

3、 如何正确地使用GIF

(三) Dreamweaver MX中的图像技术

(四) 设置网页背景

1、 改变网页背景色

2、 设置背景图像

(五) 在Dreamweaver 中巧妙地处理图像

1、 给图像添加文字说明

2、 图像映射

3、 跟踪图像

第五章 Fireworks MX中的图像技术(4学时) 教学目的与要求:

通过本章的学习,让学生熟练掌握文本工具、绘图工具和握样式的使用,以及GIF、JPEG格式图像的输出,图像处理技术和在Fireworks MX中制作HTML网页的过程。

重点难点: 文本工具、绘图工具和握样式的使用,以及GIF、JPEG格式图像的输出,图像处理技术和在Fireworks MX中制作HTML网页的过程。 教学内容:

(一) 制作漂亮的文字

(二) 制作个性化的网站标志

(三) 制作网页背景图像

(四)对图像进行美化

(五) 制作HTML网页

(六) Dreamweaver MX与Fireworks MX的配合使用

4 第六章 表格(4学时) 教学目的与要求:

通过本章的学习,让学生熟练掌握表格的创建、编辑过程、表格的嵌套 、表格的宽度、边框、背景色和背景图像的位置和表格的各种标签的源代码,了解表格的组成及各项参数的含义。

重点难点: 表格的创建、编辑过程、表格的嵌套 、表格的宽度、边框、背景色和背景图像的位置和表格的各种标签的源代码 教学内容:

(一) 表格的组成

(二) 建立表格

(三) 表格属性

(四) 在表格内添加元素

(五) 选择表格

(六) 编辑表格

(七) 增加、删除行和列及拆分、合并单元格

(八) 表格的缩放

1、 用拖放方法缩放表格的大小

2、 用表格的[属性]面板改变表格尺寸

(九) 一个完整的页面制作过程

1、 页眉的制作

2、 左侧导航区的制作

3、 制作中间主要区域

4、 制作右侧新闻摘要区 第七章 框架(4学时) 教学目的与要求:

通过本章的学习,让学生熟练掌握创建、保存框架的过程、框架组、框架的属性设置和框架中链接的目标显示窗口、了解框架的含义。

5 重点难点: 创建、保存框架的过程、框架组、框架的属性设置和框架中链接的目标显示窗口 教学内容:

(一) 建立框架

1、 建立框架

2、 插入框架

3、 添加内容

4、 保存框架

(二) 选取框架

1、 选择一个框架

2、 选择框架组

(三) 框架和框架组的属性

1、 框架属性

2、 框架组属性

(四) 编辑框架

(五) 框架中链接的目标显示窗口 第八章 表单(4学时) 教学目的与要求:

通过本章的学习,让学生熟练掌握各表单的属性,了解表单的含义。重点难点:各表单的属性 教学内容:

(一) 创建一个反馈表单

(二) 测试表单页

(三) 表单及表单域的各项属性

第九章 插入其他对象(4学时) 教学目的与要求:

通过本章的学习,让学生熟练掌握水平线、6种文件头标签、插入字符的使用,熟练在网页中插入多种格式的视频。

重点难点:水平线、6种文件头标签、插入字符的使用,熟练在网页中插入多种格式的视频 教学内容:

(一) 插入水平线

(二) 插入文件头标签

(三) 插入字符

(四) 插入多媒体

1、 插入Flash动画

2、 插入插件

3、 播放“*.rm”格式影片 第十章 HTML样式和CSS样式(4学时) 教学目的与要求:

通过本章的学习,让学生熟练掌握HTML样式的用法、CSS样式的创建、3种放置CSS代码的方式,了解CSS样式的定义。

重点难点:HTML样式的用法、CSS样式的创建、3种放置CSS代码的方式 教学内容:

(一) HTML样式

1、 新建样式

2、 应用HTML样式

3、 清除HTML样式

4、 在面板中处理样式

(二) 什么是CSS样式

(三)[CSS样式]面板

(四)CSS的属性

(五) 使用Dreamweaver MX中的CSS样式编辑器

1、 创建自定义样式

2、重定义HTML标签

3、 使用CSS选择器

4、 附加样式表 第十一章 Flash MX(4学时) 教学目的与要求:

通过本章的学习,让学生熟练掌握用工具箱中的工具创建和编辑图形、视频、音频的导入、运动动画、变形动画的创建、运动引导动画、遮罩动画的创建,了解矢量动画、位图图像的定义。

重点难点: 用工具箱中的工具创建和编辑图形、视频、音频的导入、运动动画、变形动画的创建、运动引导动画、遮罩动画的创建 教学内容:

(一) 基础知识

1、 电脑动画

2、 矢量图形

3、 位图图像

4、 Flash动画的特点

(二) Flash MX

(三) 创建图形

(四) 编辑图形

(五) 素材和元件

1、 视频的导入

2、 音频的导入

3、元件

(六) 创建基本动画

1、 运动动画和变色动画

2、 变形动画

3、 逐帧动画

(七) 创建多层动画

8

1、制作运动引导动画

2、 制作遮罩动画

(八)作品的测试和发布

1、 作品的测试

2、 作品的优化

3、 作品的导出和发布 第十二章 模板和库(4学时) 教学目的与要求:

通过本章的学习,让学生熟练掌握模板、库的创建方法,了解[资源]面板的一般用法。

重点难点: 模板、库的创建方法 教学内容:

(一) [资源]面板

(二) Dreamweaver MX中的模板

1、 创建模板

2、创建可编辑区域

3、 创建重复区域

4、 创建重复表格

5、 编辑模板

6、 使用模板

(三) Dreamweaver MX中的库

1、 什么是库

2、 怎样使用库

第十三章 源代码相关功能及行为(4学时) 教学目的与要求:

通过本章的学习,让学生熟练掌握13种行为的创建过程、代码提示、标签选择器、标签编辑器、标签检查器的使用,了解标签管理器的一般用法。 重点难点:13种行为的创建过程、代码提示、标签选择器、标签编辑器、标签检查器的使用

9 教学内容:

(一) 查看源代码

(二) 管理标签库

(三) Dreamweaver中的编码

1、 使用代码提示加入背景音乐

2、 使用代码片断快速创建网页

3、 使用标签选择器插入浮动框架

4、使用标签编辑器编辑标签

5、 用标签检查器编辑标签

6、使用快速标签编辑器插入标签

(四) 插入HTML注释

(五) [行为]面板

(六) 事件

(七) 动作

1、 播放声音

2、 打开浏览器窗口

3、 弹出信息

4、 调用JavaScript

5、 改变属性

6、 交换图像

7、 检查浏览器

8、 检查表单

9、 控制Shockwave或Flash

10、 转到URL

11、 设置导航条图像

12、 跳转菜单

13、 弹出式菜单 第十四章 网页发布(4学时) 教学目的与要求:

通过本章的学习,让学生熟练掌握设置FTP上传的步骤、发布网页的过程、检查、改变站点范围的链接的方法、检查、改变站点范围的链接的方法、清理文档的过程、同步的使用方法,了解报告的作用。

10 重点难点:设置FTP上传的步骤、发布网页的过程、检查、改变站点范围的链接的方法、检查、改变站点范围的链接的方法、清理文档的过程、同步的使用方法 教学内容:

(一) 设置FTP上传

(二) 发布网页

(三) 报告

(四) 检查站点范围的链接

(五) 改变站点范围的链接

(六) 查找和替换

(七) 清理文档

(八) 同步

本文来自 99学术网(www.99xueshu.com),转载请保留网址和出处

上一篇:物业公司工作小结下一篇:物业管理应急预案