HTML学习：表格与表单详解

"阶段1-前端-HTML（二）.pdf" HTML是超文本标记语言，是构建网页的基础，本资料主要讲述了HTML中的表格、表单和内联框架等重要概念。 一、HTML表格 HTML表格用于展示结构化的数据，通过<table>标签创建。基本结构包括<tr>（表格行）、<td>（表格数据单元格）和<th>（表格表头单元格）。<tr>标签定义行，每个行内包含<td>或<th>单元格。<th>单元格通常用于表头，其内容默认加粗并居中。更复杂的表格可以使用<caption>（表格标题）、<thead>（表头）、<tbody>（表格主体）和<tfoot>（表格页脚）进行结构化。<caption>需紧随<table>后，一个表格仅允许一个标题。<thead>、<tbody>和<tfoot>则用于组织表格内容，浏览器按thead、tbody、tfoot顺序显示，大量数据时有助于逐步加载。 表格相关属性： - table标签可选属性：如border（边框宽度），width（宽度）等 - tr标签可选属性：如rowspan（跨行）和colspan（跨列） - td/th标签可选属性：如rowspan, colspan, align（对齐方式），valign（垂直对齐方式）等 二、HTML表单 HTML表单是用户与服务器交互的重要工具，由<form>标签定义。表单可以包含多种元素，如<input>（输入框）、<textarea>（多行文本输入）、<select>（下拉列表）等。表单的主要作用是收集用户数据并发送到服务器。 表单属性： - action：指定处理表单数据的URL - method：定义数据提交方式，POST或GET。POST较安全，数据量大，不会显示在地址栏；GET数据量小，数据会显示在地址栏 POST和GET方法： - POST：数据隐藏在请求体中，适用于大量或敏感数据，不会显示在URL。 - GET：数据在URL中可见，通常用于非敏感信息，如搜索查询。 表单元素如<input>有多种类型，如text（文本输入）、password（密码输入）、submit（提交按钮）等，各具特点和用途。表单的提交事件可以通过JavaScript进行控制，实现验证和异步提交。 三、HTML内联框架 HTML内联框架（<iframe>）允许在单一页面中嵌入另一个HTML文档，常用于加载广告、地图、视频等内容。通过src属性指定要加载的URL，height和width属性定义框架尺寸。还可以使用frameborder属性去除边框，scrolling属性控制是否显示滚动条。 总结，本资料详细讲解了HTML中的表格创建、表单设计以及内联框架的使用，这些都是前端开发中不可或缺的基础知识。掌握这些，能帮助开发者构建更丰富、交互性更强的网页。