网页制作与设计技术第五讲使用教材：《网页设计与制作实用技术》

网页制作与设计技术第五讲使用教材：《网页设计与制作实用技术》网页制作与设计技术第五讲使用教材：《网页设计与制作实用技术》网络信息中心屈薇薇 Email：quweiwei@swust.edu.cn

创建锚记链接 • 锚点即为一个文档中的某一个特定的位置的标记，通过创建锚点，可以某个超级链接链接到文档的某个锚点，方便文档之间的跳转。 • 创建到锚点的链接的过程分为两步：创建锚点、创建到该锚点的链接。

命名锚记 • 只能包含字母和数字，且不能以数字开头 • 锚记区分英文字母的大小写 • 锚记名称间不能含有空格，也不能含有特殊字符

链接锚记所在位置 • 若要创建到相同文件夹下的其他文档的锚点，只需在文档名后加“#锚点名称”即可。若需要链接到父目录中的文件的某个链接，则使用相对路径就可实现。在文本框中输入“../文件名.htm#”锚记名称。若需链接到某个目录下的文件中的某个锚记，则使用绝对路径。

注意 • 创建到锚点的链接，会在锚点名称前加一个#号，表示后面为一个锚点的名称。 • 在#和锚记名称之间不要留有空格，否则链接会失败。 • 在不同文件夹中为锚记创建链接时，其文件名后缀必定为.htm • 符号#必须是半角符号，而不能为全角符号。

创建电子邮件超链接 • 在网页中创建E-mail链接，可以实现用户与网络之间的交流，使网站管理者从浏览者那里获取各种反馈信息。

创建下载文件超链接

创建空链接 • 空链接是指没有目标端点的链接。利用空链接，可以激活链接对象，从而为其添加一个行为。 • 选中要创建空链接的对象 • 在属性面板的链接文本框中输入“#”号

创建脚本链接 • 脚本链接是一种特殊的链接，单击带有脚本链接的对象，可以运行相应的JavaScript脚本或函数。 • 选中要创建脚本链接的对象。 • 在属性面板的“链接”文本框中输入“JavaScript”及脚本函数。 • 测试结果

自定义链接颜色 • 在“页面属性”对话框中，通过颜色拾取器选择颜色或直接输入各颜色代码。

用HTML创建超链接<A></A> • href 链接地址路径 • target 目标文件载入方式 • 电子邮件链接 <A href=mailto:quweiwei@swust.edu.cn> 跟我联系</A> • 锚记链接 <A name=“top”>目录</A> <A href=“#top”>返回目录</A>

利用站点地图管理超链接 • 建立网页间的超链接

解除网页间的超链接

更新超链接

检查超链接

修复超链接 • 双击“文件”栏中的文件名打开网页，在打开网页时断裂的超链接会被自动选择，在属性面板中重新设置“链接”选项即可。

检查外部链接 • 双击网页文档名称，打开网页查看是否有出错的超链接。 • 将外部超链接的地址复制到浏览器中检查是否能正确链接到该网站。

表单 • 表单是用于实现网页浏览者与服务器之间信息交互的一种页面元素，在WWW上他被广泛用作各种信息的收集和反馈。 • 网页中的表单是由表单域与表单对象构成的。表单域是指包换各个表单对象的区域表单对象是用来进行表单交互的各种工具

典型表单的组成内容 • 表单标签：这里面包含了处理表单数据所用程序的URL地址和数据提交到服务器的方法。 • 表单域：包含了文本字段、密码框、隐藏域、多行文本区域、复选框、单选按钮、下拉列表框和文件上传框，用于接收用户输入或选择的信息。 • 表单按钮：包括提交按钮、复位按钮和一般按钮。用于将数据传送到服务器或者取消输入，还可以用表单按钮来控制其它脚本处理语句的处理工作。

创建空白表单 动作：制定处理已提交表单数据的程序。它可以是一个URL地址或一个电子邮件地址。方法：指明提交表单的HTTP方法。目标：指定超链接页面的目标地址。 MIME类型：用来指定把表单数据提交给服务器时的MIME编码类型。 FORM标签不能嵌套，即表单不能嵌套插入表单的HTML语法为 <FORM Action=“URL” Method=“GET|POST” Enctype=“MIME类型”TARGET=“…”>…(表单元素） </FORM>

当只需要收集简单的信息而不需要及时完成交互时，可以参用电子邮件的方式传送表单信息。当只需要收集简单的信息而不需要及时完成交互时，可以参用电子邮件的方式传送表单信息。 • 将“动作”属性设置为“mailto：E-mail邮箱名”，“方法”属性设置为Post，同时将MIME类型属性设置为multipart/form-dataMIME. • 提交表单的用户机器上必须使用Outlook Express作为默认邮件客户端，否则无法使用。

表单域 • 文本框 • 隐藏域 • 复选框 • 单选钮 • 列表/菜单 • 按钮

文本框是一种让访问者自己输入内容的表单对象，通常被用来填写单个字或简短的回答。文本框是一种让访问者自己输入内容的表单对象，通常被用来填写单个字或简短的回答。 <input type=“text” name=“…” size=“…” maxlength=“…” value=“…”>

隐藏域是用来收集或发送信息的不可见元素，一般用作搜集特定信息以及在网页间传递参数等。隐藏域是用来收集或发送信息的不可见元素，一般用作搜集特定信息以及在网页间传递参数等。 • <input name=“…” type=“hidden” value=“…”>

复选框允许用户在带选项中选择多个选项 <input type=“checkbox” name=“…” value=“…”> 注意：多个复选框可以共用一个名称，一个复选框名称变量也可以拥有多个值。多个复选框共用一个名称时，被选中的多个复选框的值将作为该复选框名称变量的当前值提交到服务器。

单选钮允许用户在带选项中选择唯一的答案 <input type=“radio” name=“…” value=“…”> 该名称必须在该表单内唯一。

“列表/菜单”域允许用户在一个有限的空间内设置多个选项，并且可以从中选择一个或多个选项。“列表/菜单”域允许用户在一个有限的空间内设置多个选项，并且可以从中选择一个或多个选项。在浏览器中首次载入该表单域时，使列表中的某一项处于选中状态 <select name=“…” size=“…” multiple> <option value=“…” selected>…</option> …… </select> 用户选择该项时将发送到服务器的数据在列表中显示的文本

按钮分为提交按钮、重置按钮和一般按钮 单击该按钮时，根据处理脚本激活一种操作在单击该按钮时，将表单获得的数据送出，以便服务器的处理程序完成数据的处理 <input type=“submit” name=“…” value=“…”> 使所有表单的当前值恢复到初始值

注意：在使用文件字段以前，请先确定你的服务器是否允许匿名上传文件，并且把表单标签中的MIME编码属性设置为multipart/form-data以确保文件被正确编码。表单的提交方式必须设置成POST方法。注意：在使用文件字段以前，请先确定你的服务器是否允许匿名上传文件，并且把表单标签中的MIME编码属性设置为multipart/form-data以确保文件被正确编码。表单的提交方式必须设置成POST方法。

示例：创建一个简单的表单

网页制作与设计技术 第五讲 使用教材： 《 网页设计与制作实用技术 》