3.1 表单的基本结构
HTML表单是网页中用于收集用户输入信息的重要元素。一个基本的表单通常由以下部分组成：
<form>标签：定义表单的开始和结束。<input>标签：用于输入数据。<label>标签：为输入字段定义标签。<button>标签：用于提交表单。
下面是一个简单的表单示例：
<form action="/submit_form" method="post">
<label for="username">用户名:</label>
<input type="text" id="username" name="username">
<label for="password">密码:</label>
<input type="password" id="password" name="password">
<button type="submit">登录</button>
</form>
在这个示例中，用户名和密码将被提交到服务器上的 /submit_form 路径。
3.2 输入类型
HTML5 引入了许多新的输入类型，使得表单设计更加灵活和强大。以下是一些常用的输入类型：
text：用于文本输入，如用户名、邮箱等。password：用于密码输入，输入内容会被隐藏。email：用于电子邮箱地址，会自动验证邮箱格式。tel：用于电话号码输入，通常会有数字键盘。number：用于数字输入，可以设置最小值和最大值。
3.3 表单验证
HTML5 提供了内建的表单验证功能，可以确保用户输入的数据符合预期。以下是一些常用的验证属性：
required：表示该字段为必填项。pattern：用于正则表达式验证，可以自定义验证规则。min和max：分别用于设置数字输入的最小值和最大值。
以下是一个带有验证的表单示例：
<form action="/submit_form" method="post">
<label for="username">用户名:</label>
<input type="text" id="username" name="username" required pattern="^[a-zA-Z0-9]+$">
<label for="password">密码:</label>
<input type="password" id="password" name="password" required>
<label for="age">年龄:</label>
<input type="number" id="age" name="age" min="18" max="99">
<button type="submit">登录</button>
</form>
在这个示例中，用户名必须是字母或数字的组合，密码是必填项，年龄必须在 18 到 99 之间。
3.4 框架集
框架集（frameset）用于在浏览器窗口中创建多个并排的框架。以下是框架集的基本结构：
<frameset rows="50%,50%">
<frame src="header.html">
<frame src="content.html">
</frameset>
在这个示例中，窗口被分为两个框架，顶部框架占 50%，底部框架占 50%。每个框架都可以加载不同的 HTML 页面。
3.5 注意事项
- 框架集已被 HTML5 弃用，推荐使用 CSS3 的
grid或flexbox来实现类似的功能。 - 表单验证虽然方便，但并不完全可靠，服务器端验证仍然是必要的。
通过本章的学习，你应该对 HTML 表单和框架集有了更深入的了解。在实际应用中，灵活运用这些知识，可以制作出更加丰富和实用的网页。