下载文档原格式
第7章表单在制作动态网页时，要实现信息交互，常常用到表单。
常见的表单有搜索表单、用户登录注册表单、调查表单、留言簿表单等。
本章节将和大家一起探讨在表单的基本概念和各个元素，以及在Dreamweaver CS4中如何创建表单，并通过实例掌握表单制作的方法。
【学习目标】●了解Web服务器的作用。
●掌握IIS的安装和设置方法。
●掌握更改站点设置的方法。
●知道表单域的含义；熟练掌握各种表单栏目的插入与设置。
●能够综合使用各种表单栏目制作留言簿。
●知道发送表单结果的多种方法。
●掌握验证表单的方法。
7.1 关于表单表单是用来收集站点访问者信息的域集，可实现网页与浏览者间的交互，达到收集浏览者输入信息的目的。
表单是浏览网页的用户与网站管理者进行交互的主要窗口，Web管理者和用户之间可以通过表单进行信息交流。
表单内有多种可以与用户进行交互的表单元素，如文本框、单选框、复选框、提交按钮等元素。
在服务器端，信息处理由CGI （Common Gete Way Interface）、JSP （Javaserver Page）或ASP （Active Server Page）等应用程序处理。
下面是几个表单应用的例子，邮箱用户注册表单如图14.1所示，搜索引擎表单如图14.2所示，在线测试表单如图14.3所示。
7.2 表单元素表单域简单地说，表单就是用户可以在网页中填写信息的表格，其作用是接收用户信息并将其提交给Web服务器上特定的程序进行处理。
表单域，也称表单控件，是表单上的基本组成元素，用户通过表单中的表单域输入信息或选择项目。
在建立表单网页之前，首先就要建立一个表单域。
在7.1节中详细介绍了表单的基本概念，使用Dreamweaver CS4可以创建各种表单元素，如文本框、滚动文本框、单选框、复选框、按钮、下拉菜单等。
在“插入”工具栏的“表单”类别中列出了所有表单元素，如图14.4所示7.2.1 插入表单（1）将光标放在“编辑区”中要插入表单的位置；然后在“插入”工具栏的“表单”类别中，单击“表单”按钮；此时一个红色的虚线框出现在页面中，表示一个空表单，如图14.5所示（2）单击红色虚线，选中表单；在“属性检查器”中，“表单名称”文本框中输入表单名称，以便脚本语言Javascript通过名称对表单进行控制；在“方法”下拉列表框中，选择处理表单数据的传输方法，“Post”方法是在信息正文中发送表单数据，“Get”方法是将值附加到请求该页面的URL中；在“目标”下拉列表框选择服务器返回反馈数据的显示方式，这里选择“_blank”，即在新窗口打开；“MIME类型”下拉列表框指定提交服务器处理数据所使用MIME编码类型。
思考与练习答案第1章1、填空题：（1）文字、图片和超链接（2）“设计者”模式和“代码编写者”模式（3）“设计”视图、“代码”视图和“拆分”视图。
2、简答题（1）简述Drea mweav er 8的基本菜单的组成。
答：●【文件】菜单：包括对文件进行操作的标准菜单项，还包括各种其他命令用于查看当前文档或对当前文档执行的操作。
例如：【新建】、【打开】、【保存】、【在浏览器中预览】和【打印代码】等。
●【编辑】菜单：包括用对文本进行操作的标准菜单项，还包括选择和搜索命令。
例如：【剪切】、【拷贝】、【粘贴】、【选择父标签】和【查找和替换】等●【查看】菜单：可以看到文档的各种视图，并且可以显示和隐藏不同类型的页面元素以及不同的 Dreamw eaver工具。
●【插入】菜单：提供插入栏的替代项，以便用于将对象插入文档。
●【修改】菜单：可以更改选定页面元素或项的属性。
使用此菜单，可以编辑标签属性，更改表格和表格元素，并且为库项和模板执行不同的操作。
●【文本】菜单：可以轻松地设置文本的格式。
●【命令】菜单：提供对各种命令的访问。
●【站点】菜单：提供一些菜单项，这些菜单项可用于创建、打开和编辑站点，以及用于管理当前站点中的文件。
●【窗口】菜单：提供对 Dreamw eaver中的所有面板、检查器和窗口的访问。
●【帮助】菜单：提供对Dre amwea ver文档的访问，包括使用 Dreamw eaver以及各种语言的参考材料。
（2）简述插入面板所包含的选项卡的种类。
答：●“常用”选项卡：包含用于创建和插入最常用对象（如图像、表格）的按钮。
●“布局”选项卡：允许插入布局表格和图层两种方式，并且可以在两种视图之间进行选择。
●“表单”选项卡：允许插入制作页面表单的各个元素。
网页的版式设计（一）编者按：很多从事网页设计的计算机专业人员，对于网页的制作技术驾轻就熟，但对于网页富有艺术性和个性的设计却感到力不从心。
特别是没有经过艺术设计专业训练的网页制作者，在掌握了网页制作技术的情况下，都渴望将自己的网页制作得更具创意和美感。
目前关于网页制作的讨论和介绍，多以讲解软件的技术性操作为主要内容，侧重艺术方面的非常之少。
经过作者同意，从这一期开始，我们选载《网页艺术设计》一书的部分章节，从最基本的内容讲起，希望对广大网页制作者有所助益。
一、文字的格式化1.字号、字体、行距字号大小可以用不同的方式来计算，例如磅（point）或像素（pixel）。
因为以计算机的像素技术为基础的单位需要在打印时转换为磅，所以，建议采用磅为单位。
最适合于网页正文显示的字体大小为12磅左右，现在很多的综合性站点，由于在一个页面中需要安排的内容较多，通常采用9磅的字号。
较大的字体可用于标题或其他需要强调的地方，小一些的字体可以用于页脚和辅助信息。
需要注意的是，小字号容易产生整体感和精致感，但可读性较差。
网页设计者可以用字体来更充分地体现设计中要表达的情感。
字体选择是一种感性、直观的行为。
但是，无论选择什么字体，都要依据网页的总体设想和浏览者的需要。
粗体字强壮有力，有男性特点，适合机械、建筑业等内容；细体字高雅细致，有女性特点，更适合服装、化妆品、食品等行业的内容。
在同一页面中，字体种类少，版面雅致，有稳定感；字体种类多，则版面活跃，丰富多采。
关键是如何根据页面内容来掌握这个比例关系。
从加强平台无关性的角度来考虑，正文内容最好采用缺省字体。
因为浏览器是用本地机器上的字库显示页面内容的。
作为网页设计者必须考虑到大多数浏览者的机器里只装有三种字体类型及一些相应的特定字体。
而你指定的字体在浏览者的机器里并不一定能够找到，这给网页设计带来很大的局限。
解决问题的办法是：在确有必要使用特殊字体的地方，可以将文字制成图像，然后插入页面中。
《网页设计与开发第７章》试卷一、选择题1、下列关于表单得说法不正确得一项就是( )。
A.表单元素可以单独存在于网页表单之外B。
表单中包含各种对象，例如文本域、列表框、复选框与单选按钮Ｃ。
get与poｓt方法就是浏览器将表单信息提交给服务器程序得两种主要方法Ｄ.表单由两部分组成:一就是描述表单得HTML源代码;二就是用来处理用户在表单域中输入得信息得服务器端应用程序客户端脚本答案： A2、下列不就是表单域得控件就是（).A。
单行文本框B。
复选框C.下拉菜单D。
图文框答案： D3、ＨTMＬ语言中表单得作用就是（)。
A。
显示图像B．设置超链接C.收集用户反馈信息Ｄ.显示网页信息答案： C4、有如下一行代码〈inpuｔtｙpe="text”name=”txｔ＂＞请问它得功能就是（).A.创建一个文本框B.创建一个密码框C.创建一个文本域D．创建一个按钮答案： A5、在HＴML中，<form ａctｉon＝？＞,aｃtion表示( )。
A.提交得方式B.表单所用得脚本语言C．提交得URＬ地址D。
表单得形式答案: Ｂ6、在HTML中,〈foｒm methoｄ=?＞，ｍetｈｏd表示（ ).A.提交得方式B。
表单所用得脚本语言C.提交得UＲＬ地址D.表单得形式答案: A７、增加表单得复选框得HTML代码就是( )。
Ａ。
<ｉnｐut typｅ＝sｕbｍit>B.<iｎpｕt ｔype=imaｇe ＞Ｃ.<input tyｐｅ＝ｔexｔ〉Ｄ.〈iｎpｕt type=ｃｈecｋｂox＞答案： D8、增加表单得密码域得ＨTML代码就是( )。
A。
<inｐut tyｐｅ＝sｕbmit〉Ｂ。
〈inｐut tｙpｅ=ｐａssｗoｒｄ〉C．<ｉnｐut type＝radio＞D。
＜iｎput tyｐe=chｅckｂox〉答案: B9、创建选项菜单应使用以下标记符( )。
Ａ。
《网页设计与开发第7章》试卷一、选择题1。
下列关于表单的说法不正确的一项是（ ).A．表单元素可以单独存在于网页表单之外B．表单中包含各种对象，例如文本域、列表框、复选框和单选按钮C．get和post方法是浏览器将表单信息提交给服务器程序的两种主要方法D．表单由两部分组成：一是描述表单的HTML源代码；二是用来处理用户在表单域中输入的信息的服务器端应用程序客户端脚本答案： A2. 下列不是表单域的控件是( ）。
A．单行文本框B．复选框C．下拉菜单D．图文框答案: D3. HTML语言中表单的作用是( ）。
A．显示图像B．设置超链接C．收集用户反馈信息D．显示网页信息答案: C4。
有如下一行代码〈input type=”text”name="txt”〉请问它的功能是（）。
A．创建一个文本框B．创建一个密码框C．创建一个文本域D．创建一个按钮答案： A5.在HTML中，〈form action=?〉，action表示（）。
A．提交的方式B．表单所用的脚本语言C．提交的URL地址D．表单的形式答案： B6。
在HTML中，〈form method=?〉，method表示（）。
A．提交的方式B．表单所用的脚本语言C．提交的URL地址D．表单的形式答案： A7.增加表单的复选框的HTML代码是（）。
A．<input type=submit〉B．〈input type= image 〉C．〈input type=text>D．<input type=checkbox>答案: D8。
增加表单的密码域的HTML代码是（）.A．〈input type=submit>B．〈input type=password〉C．<input type=radio〉D．〈input type=checkbox>答案： B9. 创建选项菜单应使用以下标记符（ ).A．SELECT 和OPTIONB．INPUT 和LABELC．INPUTD．INPUT 和OPTION10。
练习7一、填空题1、在HTML文档中引入JavaScript有两种方式，一种是内嵌式；另一种是___________。
2、JavaScript___________，又被称为“保留字”，是指在JavaScript语言中被事先定义好并赋予特殊含义的单词。
3、JavaScript中主要包括两种注释：单行注释和___________注释。
4、在Javascript中，函数使用关键字___________来定义。
5、在JavaScript中，所有的JavaScript变量都由关键字___________声明。
二、判断题1、在HTML文档中引入JavaScript，有直接嵌入JavaScript脚本和链接外部JavaScript脚本两种。
（）2、在HTML文档中引入JavaScript，JavaScript脚本只能放在<head>和</head>之间。
（）3、在<script type="text/javascript">代码中，type属性用来指定HTML文档引用的脚本语言类型。
（）4、JavaScript语言中的关键字可以作为变量名和函数名使用。
（）5、JavaScript的变量名严格区分大小写，如UserName与username代表两个不同的变量。
（）6、在JavaScript中命名变量时，必须以字母或下划线开头，中间必须是数字。
（）7、在javascript中，函数由关键字“function”、“函数名”、“参数”和“函数体”四部分组成。
（）8、在JavaScript中，所有数字都是数值型，并不区分整型数值和浮点型数值。
（）9、在JavaScript中，运算符i++表示在使用i之前，使i的值加1；而++i表示在使用i之后，使i的值加1。
（）10、在javascript中，可以使用函数名来创建函数，并且函数名可以有多个。
（）三、选择题1、下列选项中，关于插入Javacript 脚本位置正确的是（）A、<body>部分B、<head>部分C、<body>部分和<head> 部分均可D、以上都不正确2、下列选项中，哪个HTML 元素中可以放置Javascript 代码？（）A、<script>B、<javascript>C、<js>D、<scripting>3、每一种计算机语言都有自己支持的数据类型。
网页制作教学设计(通用7篇)作为一位杰出的老师，常常需要准备教学设计，借助教学设计可以让教学工作更加有效地进行。
那么问题来了，教学设计应该怎么写？以下是小编收集整理的网页制作教学设计，希望能够帮助到大家。
网页制作教学设计11、教学目标知识与技能：灵活运用添加超链接和在网页中插入表格方法，根据网页内容进行页面布局，完善网页,掌握网页布局的技能和技巧。
过程与方法：培养学生加工信息和应用信息的能力及培养学生思维能力，规划能力、创新能力、及合作能力。
情感与态度：使学生感受中国源远流长的历史文明，并通过网页传递给世界；帮助学生树立良好的信息道德意识；让学生享受成就感，树立自信心。
2、学生分析初中二年级学生感知能力较强,理解能力和抽象思维较弱;学生基本学会使用在网页中插入表格的方法，但分析信息、处理信息和应用信息能力较弱;对教学内容的了解程度较强。
3、内容分析教学重点：利用表格对网页页面进行布局。
教学难点：怎样合理、美观地设计网页页面布局。
此部分教学内容在整个网页设计知识体系中处于综合处理信息的重要部分。
4、教学策略设计（1）．教学方法设计我根据教学主题及其教学目标确定的教学指导思想是以学生为主体，以学生自己的亲身体验展开探究式小组合作学习。
本节课采用研究体验式教学法,建构主义模式下的任务驱动式教学法组织教学。
首先设计“总任务”，再细分成若干“小任务”，实现教学目标。
（2）．教-学流程和教-学活动的设计思路整个教学活动，尤其是学习活动，我采用探究式学习法，又称研究性学习，我强调的是学生在教师指导下，根据各自的兴趣、爱好和条件，再结合与自己有相同或相近的兴趣、爱好的同学组成合作伙伴，共同选择西安不同的旅游景点，确定研究课题，借助“表格布局”功能规划七天的旅游行程，独立自主结合小组合作开展研究，进行合理的网页布局设计，达到从中培养创新精神和创造能力及审美能力的一种学习方式，实现“双赢”。
建构主义学习理论认为，学习过程不是学习者被动地接受知识，而是积极地建构知识的过程，把学过的网页设计知识综合应用起来，由于建构主义学习活动是以学习者为中心，而且是真实的，并且以完成特定的任务为动力，因而学习者就更具有兴趣和动机，能够鼓励学习者进行批判型思维，能够更易于提供个体的学习风格，展现自己的独特思维，不受现有网页模式的拘束。
