毕业设计(论文)-《通信原理》网络课件的制作.doc_第1页
毕业设计(论文)-《通信原理》网络课件的制作.doc_第2页
毕业设计(论文)-《通信原理》网络课件的制作.doc_第3页
毕业设计(论文)-《通信原理》网络课件的制作.doc_第4页
毕业设计(论文)-《通信原理》网络课件的制作.doc_第5页
已阅读5页,还剩34页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

通信原理通信原理网络课件的制作网络课件的制作 The Web-Based Courseware for Communication Principles I 中文中文 提要提要 网络环境下的在线学习系统,具有平等交互式的学习环境、丰富的信息容量和丰富 的表现形式等特点。在线学习方式已经在开放教育领域大显身手。网络课件是运行在服 务器端,客户端通过浏览器浏览或下载运行的课件。近年来网络课件迅速发展,成为课 堂教学的重要辅助手段。制作通信原理课程网络课件,能弥补通信原理课程传 统课堂教学方式的不足。 文章主要从两个方面介绍通信原理网络课件的制作,包括课件的设计和课件的 制作。课件设计部分提出了我对制作通信原理网络课件的基本构想以及关于网页制 作的建议。课件制作部分讲述了我在课件制作过程中遇到的一些问题以及解决方案。 关键词关键词:通信原理 网络课件 在线学习 II AbstractAbstract The on-line studying system of network can take equal studying situation, plentiful information and forms to each other. Nowadays, the on-line studying system has achieved great success. Web-Based Courseware is courseware that runs on web server and browsed on client using normative browser. Web-Based Courseware is developing rapidly and become an important assistance to course teaching. Web-Based Courseware for Communication Principles is constructed to assist the course teaching. Basically ,the article mainly depicts making the network courseware of “Communication Principles” from two aspects, and includes design the courseware and making courseware. . The design part put forward the mainly idea of design the courseware and some proposal for design the webs on my own. The making part depicts the problems that come into being when making courseware, and gives some advices about making courseware intensively. KeywordsKeywords: : Communication Principles network courseware on-line studying III 目录目录 第一章第一章 网络课件的重要性网络课件的重要性 .1 1 1.1 网络课件的开发背景.1 1.1.1 网络课件的定义.1 1.1.2 网络课件的特点.1 1.2 网络课件在教学中的应用.2 第二章第二章 通信原理通信原理课件的设计课件的设计 .3 3 2.1 整体结构设计.3 2.2 界面设计.4 2.3 导航设计.4 2.4 交互设计.5 2.4.1 论坛讨论功能.5 2.4.2 在线测试功能.6 第三章第三章 通信原理通信原理课件的制作工具介绍课件的制作工具介绍 .7 7 3.1 有关 PHOTOSHOP CS3 在制作中的使用.7 3.2 有关 DREAMWEAVER 8 在制作中的使用.7 3.3 有关 FLASH 8 在制作中的使用.8 3.4 有关 VISUAL STUDIO 2005 在制作中的使用 .8 第四章第四章 通信原理通信原理课件的制作课件的制作 .9 9 4.1 网页主模版的制作.9 4.1.1 网页主模版的结构.9 4.1.2 网页主模版的背景.10 4.1.3 CSS 样式表.10 4.1.4 Java script 脚本语言.11 4.1.5 HTML 中的 Iframe 标记.12 4.2 内容网页的制作.13 4.2.1 普通内容网页.14 4.2.2 在线搜索内容网页.15 4.2.3 Flash 相关内容网页.17 4.3 相关 FLASH 的制作.17 4.3.1 在线测试 Flash 的制作.18 4.3.2 网络课件 Flash 的制作.22 4.4 互动平台的制作.24 4.4.1 注册.24 4.4.2 登陆.27 4.4.3 学生信息管理.27 4.4.4 简易学生论坛.29 第五章第五章 总结与展望总结与展望 .3131 5.1 总结.31 5.2 展望.31 IV 体会及谢词 .3232 参考文献 .3333 第第 1 1 页页 第一章第一章 网络课件的重要性网络课件的重要性 1.11.1 网络课件的开发背景网络课件的开发背景 随着计算机网络技术、信息技术和现代教育技术的飞速发展,计算机广泛应用于各 行各业中,它的高效性、重要性已经逐渐被人们认可。现代远程教学中的网络多媒体课件, 便是这三大技术运用的结晶。 .1 网络课件的定义网络课件的定义 网络课件是基于 Browser/Server(浏览器/服务器)模式开发、能在 Internet(互联网)或 Intranet(局域网)上发布的 CAI 课件。其本质是一种 Web 应用程序。 目前非专业人员开发的网络课件一般是网页型的。由于网页具有多媒体超文本实现 能力,并且有良好的交互和动态特性,所以借助 Internet 或 Intranet 来实现计算机辅 助教学和远程教育已经开始得到大力的发展和推广。网络课件运行在服务器上,客户只 需用浏览器访问就行了,在客户端真正做到了免安装、免维护。 网络课件还实现了超媒体结构。超媒体是基于超文本支持的多媒体,多媒体的表现 可使超文本的交互界面更为丰富,由多媒体和超文本结合发展而成的超媒体系统目前已 成为一种理想的知识组织结构和管理方式。课件设计采用超媒体结构,既方便了教师操 作,又可以使教师根据实际教学情况自由选择和重新组织教学内容。 .2 网络课件的特点网络课件的特点 网络课件的高度模块化,使教师用它可以灵活地组织教学,学生用它可以灵活地选 择学习,与教无定法,学无定法的规律相适应,是推进素质教育的现代化的教学辅助 工具。 综上所述,网络课件的主要特点是: (1)体积小,传输速度快,功能强大; (2)在客户端无需安装和维护; (3)信息量大,资源共享; (4)实时交互性强,信息反馈快; (5)高度模块化,灵活性强; (6)既可助教又可助学; (7)有网络监控和广播功能。 第第 2 2 页页 1.21.2 网络课件在教学中的应用网络课件在教学中的应用 在教学过程中,网络课件是根据一定教学目标表现特定教学内容、反映一定教学策 略的多媒体应用软件,它是利用计算机多媒体技术把文字、图形、声音、动画等多种表 现媒体综合起来而形成。随着互联网的发展和迅速普及,现代多媒体技术正经历着一场 网络化的革命。计算机多媒体网络教学是将计算机多媒体技术和计算机网络技术充分结 合,将传统的课堂理论知识讲授建立于形象、生动、直观的教学之中,使教师和学生能 够最大限度地增强课堂参与意识,从多方面刺激学生的感官,进一步提高教学质量。在 这一过程中,多媒体教学课件起了重要的作用。它汇集了文字、图形、动画、视频、声 音、特殊效果等,包含了无限想象的空间,不仅改变了我们学习和理解问题的方式,而 且还改变了我们传播信息的方式。将之用于网络教学,即以其非凡的表现力,跨越时空 的能力,为教育注入了无穷的活力。但是,多媒体网络教学从某种意义上讲仍是一种新 兴的教学方式,所以如何充分利用其优越的特点,扬长避短,真正做到资源的充分利用 与教学质量的提高,成为教育界关注的热点。 在我校,网络课件的应用已经相当广泛,这不仅提高了学生自主学习的能力,还增 加了在课下与老师的交流,活跃了教学,更有利于所学知识的扩展教学。 第第 3 3 页页 第二章第二章 通信原理通信原理课件的设计课件的设计 网络课件最终是通过网页的形式表现出来的,我在制作通信原理课件之前首先 明确了教学目的,进行教学对象分析,逐步实现学生在多媒体网络环境中的自主学习。 经过对教学内容的分类,网页主题的规划,开始进行网络课件的整体结构设计、界面设 计、导航设计以及交互设计。 2.12.1 整体结构设计整体结构设计 网络课件的整体结构设计应服从教学设计的需要,首先进行任务分析,逐级找到需 要掌握的知识点,然后根据学生现有的知识结构确定合适的起点和知识传递过程,确定 信息的组织与表现形式。根据教学内容的相互联系,按照建构主义教学设计自上而下的 设计思路,形成非线性知识结构,让学生尝试解决问题,并在此过程中发现完成整体任 务所需的子任务,以及完成各级任务所需的各种知识和技能,引导学生进行有目的地探 索,实现有意义的知识建构。 根据教学内容和学生使用的特点,整体设计如下: 图 2.1-1 通信原理网络课件整体设计结构图 如图 2.1-1 所示,本课件分为两个界面,七部分内容: 登陆界面:课件封面。 主界面: (1)课程介绍:对于所学课程的基本介绍。 (2)学习课件:所学课程的内容。 (3)演示课件:对于所学内容的演示。 (4)实验教学:课程相关实验的教程。 (5)习题库:习题答案与模拟题。 (6)在线测试:所学内容的相关测试。 (7)互动平台:用于师生交流。 第第 4 4 页页 2.22.2 界面设计界面设计 网络课件的界面是实现人机交互的重要手段,界面的好坏会直接对学生产生影响。 经研究,风格独特、美观大方的界面会对学生产生激励作用,否则,就会使学生在学习 过程中感到枯燥乏味。因此在通信原理课件的界面设计时注意了以下几点: (1)针对性 网络课件的界面设计应根据通信原理课件的自身特点以及内容特征采用了相应 的表现形式。界面统一,不繁琐,整洁大方;主体色彩采用蓝色调,给人安静的感觉; 布局等方面应充分考虑学生的使用特点,合理安排。 (2)协调美观,和谐统一 从心理学角度考虑,人们总是带着某种情感经历来接受外部刺激的,情感对外部刺 激起着催化和过滤作用。富有艺术性和感染力的界面,会给学生营造一种视觉美感,使 学生在轻松愉悦的氛围中理解内容。所以在表现整体设计的时候,非常注意界面的整体 性、一致性,比如:图形、表格、按纽的位置和页面字体、颜色、大小等都做到整体布 局的和谐统一。 (3)简洁明快,富有动感 简洁明快是指界面主题清晰明确,内容概括集中,学生在查找特定内容或元素时方 便快捷,学习效率高,提高了学习积极性;另外,心理学揭示,运动及变化比任何静止 的事物都能更吸引人的注意力,所以在网络课件的设计过程中,适度地采用动态变化形 式,利用 Java script 脚本技术加入了一些动态元素,使页面富有动感,让学生更容易 产生兴奋和愉悦,集中注意力。 2.32.3 导航设计导航设计 网络教学强调以学生为中心,网络课件发布后主要用于学生自学。试想,网络课件 内容丰富,结构复杂,导航不规范,查找感兴趣的学习内容效率会大大降低。因此网络 课件导航显得尤为重要。 导航框架是将学习内容按照主次、先后、层次关系,进行索引,使相互联系的内容, 有效地分离在不同的页面中,使浏览者能清醒地了解当前所处位置,按照知识点的相互 关系,采用横向导航与纵向导航构成了网状导航。 横向导航: 图 2.3-1 通信原理网络课件横向导航 相应纵向导航: 课程介绍:课程简介、教师介绍、理论教学大纲、实验教学大纲、课程考试大纲、 第第 5 5 页页 课程考试要求、教学日历、参考信息。 学习课件:第一章绪论、第二章随机信号分析、第三章信道、第四章模拟调制系统、 第五章数字基带传输系统、第七章模拟信号的数字传输。 演示课件:AM 产生与调制、频分复用原理。 实验教学:TIMS 实验台简介、实验一、实验二、实验三、实验四、实验五、实验六。 习题库:习题答案、模拟试题。 在线测试:第一章、第二章、第三章、第四章、第五章、第七章、第九章。 互动平台:在线搜索、在线交流。 2.42.4 交互设计交互设计 网络课件应采用适当的交互方式,以提供学生在学习过程中自主学习,协作学习, 从而实现师生交互,生生交互和人机交互的目的,并设立了如下功能: .1 论坛讨论功能论坛讨论功能 学生在学习过程中可以在互动平台中,与同伴交流,发表自己的意见,或提出不懂 的问题要求教师或同伴在线实时回答。 图 2.4.1-1 论坛功能流程图 如图 2.3.1-1 所示,论坛讨论功能采用了学生需要注册而教师需要数据库直接导入 的设计思路。共有两个模块,即“学生信息管理”模块和“简易学生论坛”模块。“学 生信息管理”模块只有教师有权限进入而“简易学生论坛”模块则为教师和学生共同使 用。 第第 6 6 页页 .2 在线测试功能在线测试功能 学生使用在线测试功能可以分章节对已学内容进行测试,自测试题都为客观题,由 Flash 形式表现,可完成选择以及评分的功能。 图 2.4.2-1 在线测试功能流程图 如图 2.4.2-1 所示,在线测试功能可以完成“选择答案”“判题及得分”以及“重 置”功能,让学生轻松完成课后的自我测试。 第第 7 7 页页 第三章第三章 通信原理通信原理课件的制作工具介绍课件的制作工具介绍 在完成了设计工作之后,我便根据设计开始制作通信原理网络课件。首先对所 使用的软件进行大致的了解,然后深入学习。 从技术上讲,选择什么样的制作工具都不会影响网络课件的优劣,但是一个功能强 大,操作简单,使用方便的工具往往会带来事半功倍的效果。目前,够制作网络课件的 工具比较多,我根据自己的情况选择了网页制作工具 Dreamweaver 8, 图象处理工具 Photoshop cs3, 动画制作工具 Flash 8,以及编程工具 Visual Studio 2005。 3.13.1 有关有关 PHOTOSHOPPHOTOSHOP CS3CS3 在制作中的使用在制作中的使用 Photoshop 是 Adobe 公司旗下最为出名的图像处理软件软件之一。Photoshop cs3 是 Adobe 的核心产品。 本课件中所有的图像都是由 Photoshop cs3 制作完成的。 在网络课件中,所有图像一般采用 JPG 和 GIF 两种格式,它们都属于压缩图片格式, 具有文件小,下载速度快,跨平台等优点。对于一些需要讲究色彩浓淡的图片,我采用 了 JPG 格式,它支持 24bit 色,支持全彩和灰度格式,压缩比高。一些对色彩要求较低 的图片,我采用了 GIF 格式,因为 GIF 牺牲了色彩,保存了像素,最多呈现 256 色,可 设置透明背景,能与网页背景很好融合。 3.23.2 有关有关 DREAMWEAVERDREAMWEAVER 8 8 在制作中的使用在制作中的使用 Macromedia Dreamweaver 8 是建立 Web 站点和应用程序的专业工具。它将可视布局 工具、应用程序开发功能和代码编辑支持组合在一起,其功能强大,使得各个层次的开 发人员和设计人员都能够快速创建界面吸引人的基于标准的网站和应用程序。从对基于 CSS 的设计的领先支持到手工编码功能,Dreamweaver 8 提供了专业人员在一个集成、高 效的环境中所需的工具。开发人员可以使用 Dreamweaver 8 及所选择的服务器技术来创 建功能强大的 Intelnet 应用程序,从而使用户能连接到数据库、Web 服务和旧式系统。 Dreamweaver 8 完成了本课件中所有网页的架构,并且通过它连接整个课件的其他功 能,起着至关重要的作用。 在网络课件中,所有网页都是由 HTML 代码编写,定义了 CSS 外部样式表,并且一些 网页中使用了 Java script 脚本技术。CSS 样式表使网页的设计更加工整,便于作一些整 体修改。Java script 脚本技术完成了一些简单小功能,让网页使用起来更加方便快捷, 增加了网页的美观。 第第 8 8 页页 3.33.3 有关有关 FLASHFLASH 8 8 在制作中的使用在制作中的使用 Macromedia Flash 8 是世界上使用最广泛的软件平台。Flash 是交互式矢量图和 Web 动画的标准。网页设计者使用 Flash 能创建漂亮的、可改变尺寸的、以及极其紧密的导 航界面、技术说明以及其他奇特的效果。 本课件中“登陆界面” , “演示课件”以及“在线测试”模块都是由 Flash 8 制作完 成的。 在网络课件中,Flash 不仅起到了装饰课件以及丰富内容的作用,还让网页的画面更 加生动,从而增加了同学们的学习兴趣,以及更直观地理解所学内容,让学习过程具有 趣味性。 3.43.4 有关有关 VISUALVISUAL STUDIOSTUDIO 20052005 在制作中的使用在制作中的使用 随着 ASP.NET 2.0 技术的发布,与之相应的开发工具 Visual Studio 2005 也就产生 了,它提供了更好的集成开发环境,可高效传见任何类型的.NET 应用程序或者组件。 本课件中“互动平台”模块是由 Visual Studio 2005 利用 ASP.NET 语言制作而成的, 采用了数据库导入技术。 在网络课件中, “互动平台”的设计为老师和同学交流提供了良好的交流平台,使师 生的互动更加方便快捷。 第第 9 9 页页 第四章第四章 通信原理通信原理课件的制作课件的制作 课件制作关键环节体现在网页主模版,内容网页,相关 Flash,互动平台四部分的制 作过程中,下面进行分别介绍。 4.14.1 网页主模版的制作网页主模版的制作 图 4.1-1 网页主模版样式图 .1 网页主模版的结构网页主模版的结构 主模版利用 Dreamweaver 8 的表格功能分为四行: (1)第一行:Banner Banner 是一张 900*110 像素的图像,在生成网页的时候会导致显示过慢,所以在制 作的时候,采用了把它裁剪成两张 450*110 的图像然后依次插入的方法,这样避免了生 成网页时显示过慢的缺点。 (2)第二行:横向导航 横向导航添加链接的方式不同于纵向导航,采取了利用 Dreamweaver 8 中的矩形热 点工具直接在图上勾画出要添加链接的位置,然后在此位置上加入需要添加的链接,这 种方式避免了 Dreamweaver 8 中定义文字的单调,使页面整体更加规整美观。 第第 1010 页页 (3)第三行:分为左右两列,即:纵向导航和内容网页 左侧纵向导航利用了 Java script 脚本技术,实现了隐藏次级表格的作用。右侧内 容网页利用了 HTML 的 Iframe 语句,实现了嵌入内容网页的效果。 (4)第四行:结尾行 结尾行用了一张 900*25 像素的图像。 .2 网页主模版的背景网页主模版的背景 代码: 说明:“background”是设置背景图片。 “bg.gif”是背景图片的名字。 “images/bg.gif”是该图片相对于这个页面的位置。 在此情况下,图片会按照水平和垂直的方向不断重复出现,直到铺满整个页面。 .3 CSSCSS 样式表样式表 样式表(或者称为层叠样式表,英文名 Cascading Style Sheet,即 CSS)是 HTML 的 一部分,但作为对 HTML 元素(或者标识)展示效果的一种扩展,其功能极为强大,可以说, 有了样式表,可以完全放弃 HTML 元素的属性不用就能实现精美的网页排版于布局。 为了可以让多个 HTML 页面使用,所以采用了定义外部样式表的方式制作样式表,即 共用一个外部样式文件时就可实现只更改一个样式文件即可以全面更改所有页面的风格。 外部样式表就是在网页中调用已经定义好的样式表来实现样式表的应用,它是一个 单独的文件,在需要应用该样式表的 HTML 文档的 HEAD 元素中使用 link 元素链接: 说明:href=images/css.css是指样式表 css.css 的调用地址。 rel=stylesheet 是指在页面中使用外部样式表。 type=text/css是指文件的类型是样式表文件。 本课件中 Css.css 文件中定义的主要样式举例: (1)所用定义链接的: a:link text-decoration: none;color: black 说明:a:link 定义文字链接式样。 当鼠标未停留或未点击定义链接的文字时,链接文字显示黑色,无下划线。 a:active text-decoration:blink color: #0000CC 第第 1111 页页 说明:a:active 定义活动链接式样。 当鼠标点击定义链接的文字时,链接文字显示蓝色,无下划线。 a:hover text-decoration:underline;color: #0000CC; 说明:a:hover 定义变化图象链接式样。 当鼠标停留在定义链接的文字时,链接文字显示蓝色,有下划线。 a:visited text-decoration: none;color: black 说明:a:visited 定义已访问链接式样。 当鼠标点击完定义链接的文字时,链接文字显示黑色,无下划线。 (2)所用定义主体版面的: body margin-top: 0px; 说明:“margin-top”为定义上边距,即设置顶端的绝对边距。 在此情况下,顶端绝对边距为 0。 (3)所用定义文字的: .wz font-family: 宋体; font-size: 13px; font-style: normal; line-height: normal; font-weight: normal; color: #000000; text-decoration: none; 说明:“font-family”为定义字体。 “font-size”为定义字号。 “font-style”为定义字体风格。 “line-height”为文本行高。 “font-weight”为定义加粗字体。 “color”为定义字体颜色。 “text-decoration”为定义文字修饰。 .4 JavaJava scriptscript 脚本语言脚本语言 Java script 脚本语言是一种描述语言,此语言可以被嵌入 HTML 的文件之中。 透 过 Java script 可以做到回应使用者的需求事件而不用任何的网路来回传输资料,所以 当使用者输入一项资料时,它不用经过传给伺服端 (server) 处理,再传回来的过程, 而直接可以被客户端 (client) 的应用程式所处理。 第第 1212 页页 在网页中导入 Java script 脚本语言的代码: 说明:language=JavaScript就是指名要使用 JavaScript 语言。 src=js.js就是源文件地址。 type=text/JavaScript类型是 Java script 的文本文件。 在本课件中运用了 Java script 脚本语言中的 onClick 事件:鼠标单击事件是最常 用的事件之一,当用户单击鼠标时,产生 onClick 事件,同时 onClick 指定的时间处理 程序或代码将被调用执行。代码:onclick=showFileDetail(1,1),即触发了 js.js 中的 程序。 以下为 js.js 中的程序: function showFileDetail(divNum,totalNum) for(i=1;i=totalNum;i+) showDiv = eval(bodyDiv+i); / eval 可以将字符串生成语句执行 if(i = divNum) if(showDiv.style.display=none) showDiv.style.display=block; elseshowDiv.style.display=none; elseshowDiv.style.display=none; function fnShowHide(hiddenbody) if (hiddenbody.style.display=none) hiddenbody.style.display=block; else if(hiddenbody.style.display=block) hiddenbody.style.display=none; .5 HTMLHTML 中的中的 IframeIframe 标记标记 Iframe 标记,即浮动框架标记,可以用它将一个 HTML 文档嵌入另一个 HTML 中显示。 即这个标记所引用的 HTML 文件不是与另外的 HTML 文件相互独立显示,而是可以直接嵌 入在一个 HTML 文件中,与这个 HTML 文件内容相互融合,成为一个整体,另外,还可以 多次在一个页面内显示同一内容,而不必重复写内容,一个形象的比喻即“画中画“电 视。Iframe 框架可以完全由设计者定义宽度和高度,并且可以放置在一个网页的任何位 置。 本课件中 Iframe 标记的应用: 第第 1313 页页 src:页面源文件地址。 在此情况下,源文件地址为xxkj/part1/p1-1.html。 width、height:浮动框架的宽与高。 在此情况下,宽度为 700 像素,高度为 520 像素。 scrolling:浮动框架滚动条显示属性。 scrolling 有三种情况,包括不显示,根据需要显示和总显示滚动条。 当设置为 auto 时,为默认值,整个框架在浏览器页面中左对齐。 当设置为 yes 时,表示总是显示滚动条,即使页面内容不足以撑满框架 范围,滚动条的位置也是预留的。 当设置为 no 时,表示在任何情况下都不显示滚动条。 在此情况下,设置为 auto,自动出现滚动条。 frameborder:浮动框架边框显示属性。 frameborder 只能取 0 和 1,或者 yes 和 no。0 和 no 表示不显示,1 和 yes 为默认值,表示显示边框。 在此情况下,为了使浮动边框看起来与主模版贴合,设置为 0。 marginheight:边框与页面内容的垂直边距。 在此情况下,边框与页面内容的垂直边距为 0。 marginwidth:边框与页面内容的水平边距。 在此情况下,边框与页面内容的水平边距为 0。 name:页面名称。 name 名称是为了便于页面的查找和链接所提供的一个属性。比如一个左右框 架结构,左侧为链接,右侧为正文,当单击左侧链接以后要在右侧框架中打 开正文,此时就用到了 name 属性。 在此情况下,页面名称设置为 right,即链接右侧正文时,目标写为 right。 在网页主模版中利用了 Iframe 语句把内容网页嵌套在主模版中。左侧为链接文字, 右侧为内容正文。当点击链接文字时,右侧出现内容正文,其代码举例: 课程简介 说明: kcjs/kcjs1.html为“课程简介”内容正文的地址。 right为浮动框架的名称。 第第 1414 页页 4.24.2 内容内容网页的制作网页的制作 经上述介绍,在主模版中利用 Iframe 语句把内容网页全部嵌套,可利用左侧纵向导 航切换内容网页。所以每一个内容网页都是一个独立的由 HTML 语言编写的网页。下面介 绍一下课件中出现的三种内容网页。 .1 普通内容网页普通内容网页 图 4.2.1-1 普通内容网页样例图 普通内容网页是最简单的网页,都是利用了 Dreamweaver 的表格功能进行排版定位, 基本都是由文字和图片组成,链接了 CSS 样式表,通过浮动框架 Iframe 的形式显示在主 模版的右侧。 第第 1515 页页 .2 在线搜索内容网页在线搜索内容网页 图 4.2.2-1 在线搜索页面样式图 在线搜索内容网页利用了 Dreamweaver 8 的表单功能。 在动态网页过程中会常常用到表单。表单的用途很广泛,主要用于会员注册,网上 调查和搜索功能等,使网页具有交互功能。 本课件中表单的 Form 标记的应用: 在网页中定义了表单的开始和结束位置,在标记之间的一切都属于表 单的内容。此表单中包括表单基本属性(处理程序 action 和传送方法 method),表单元素 (文字字段 text 和提交按钮 submit)。下面分别介绍: 表单基本属性: action:用于表单数据提交到哪个地址进行处理。 在此情况下,表单提交到“ method:用于指定在数据提交到服务器的时候使用了哪种 HTTP 提交方法,可取值为 第第 1616 页页 get 和 post。 取值为 get 时,表单数据被传送到 action 属性指定的地址,然后这个新地 址被送到处理程序上。 取值为 post 时,表单数据被包含在表单主体中,被送到处理程序上。 在此情况下,取值为 get,表单数据被传送到 “ 表单元素: text:用于在文字字段内输入字符或者单行文本。 type:用于指定插入哪种表单元素。 在此情况下,type=text即为插入文字字段。 name:文字字段的名称,用于和页面中其他控件加以区别。 在此情况下,文字字段的名称为“word” 。 value:文字字段的默认取值。 在此情况下,文字字段的默认取值为空。 size:确定文本框在页面中显示的长度,以字符为单位。 在此情况下,文本框的可以显示 31 个字符。 maxlength:用来设置文本框中最多可以输入的字符数。 在此情况下,文本框可以输入 225 个字符。 submit:用于实现表单内容的提交。 type:用于指定插入哪种表单元素。 在此情况下,type=submit即为插入提交按钮。 name:提交按钮的名称。 在此情况下,提交

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论