用DW制作快递信息输入表单:步骤详解

需积分: 1 0 下载量 42 浏览量 更新于2024-09-09 收藏 164KB DOC 举报
本项目旨在教授如何在Dreamweaver中创建一个简单的快递信息输入页面。首先,学生需要在新建的HTML文档“zjxx.html”中设置表单基础结构。通过在<body>标签对内插入表单,选择“表单”类别中的“表单”元素,可以预览并编辑表单代码。需要注意的是,虽然初始代码包含了默认的`action`和`method`属性,但在这个初级项目中,由于无需实际提交数据,可以暂时移除这些属性。 接下来,用户将在`<form>`标签内创建一个具有类名`menu`的`<div>`元素,作为“增加快递信息”的标题,设置为`<h1>`标签,并添加`class="title"`以方便后续样式设计。这个阶段强调了HTML标签的结构和语义化的重要性。 项目的核心部分是分组输入字段,使用`<fieldset>`标签来组织发货人信息、收货人信息和货物信息。每个分组由`<legend>`标签标记,并分别命名为“发货单”、“收货单”和“货物信息”。在每个分组内部,添加相应的字段,如“发货人姓名”、“发货人地址”等,使用`<span>`标签包围文本字段,使其具有更强的可定制性。`<span>`标签在此处用于行内样式,而`<div>`标签则更适合包裹更大的内容区域,如整个字段。 在实践中,学生将学习到如何根据页面布局和用户体验设计,合理地使用各种HTML标签以及CSS类,以创建清晰、易用的输入界面。此外,这个项目还涉及到了HTML表单元素的基本功能和用途,以及如何通过CSS来增强表单的视觉效果和交互性。整个过程中,不仅锻炼了编码技能,也加强了对HTML和CSS语言的理解。