HTML用于构建网页结构、超链接、图像、表单和表格：一用<html><head><title><body><h1><p><ul><li>定义基础内容；二用<a href>实现外链、内链及新页跳转；三用<img src alt>嵌入图片并保障可访问性；四用<form><input><button>收集用户数据；五用<table><thead><tbody><th><td><caption>展示结构化数据。
如果您希望在网页中展示结构化内容、创建交互元素或嵌入多媒体资源，则需要通过编写具体的HTML代码来实现。以下是HTML代码在实际场景中的多种应用示例：
一、构建基础网页结构
HTML最核心的作用是定义网页的骨架，包括标题、段落、列表等基本内容区块。浏览器依据这些标签识别内容层级与语义，从而正确渲染页面布局。
1、使用<html>标签作为整个文档的根容器。
2、在<head>中添加<title>定义网页标题，该标题显示在浏览器标签页上。
立即学习“前端免费学习笔记（深入）”；
3、将主要内容放入<body>内，例如用<h1>表示主标题，<p>包裹正文段落。
4、插入无序列表时，使用<ul>包裹多个<li>项，每个<li>代表一个列表条目。
二、创建可点击的超链接
超链接是Web导航的基础，HTML通过<a>标签实现页面间跳转或资源访问，其href属性指定目标地址。
1、编写<a href="https://example.com">访问示例网站</a>，用户点击后跳转至指定URL。
2、若需在新标签页打开链接，添加target="_blank"属性：target="_blank"。
3、链接可指向同一网站内的其他页面，如href="about.html"，此时路径为相对地址。
4、锚点链接可用于页面内快速定位，例如href="#section2"配合<div id="section2">实现内部跳转。
三、嵌入图像与替代文本
图像增强网页表现力，HTML使用<img>标签加载图片，并强制要求alt属性以保障可访问性与SEO优化。
1、基本写法为<img src="photo.jpg" alt="一张风景照">，其中src指向图片文件路径。
2、添加width和height属性可预设显示尺寸，避免页面重排导致的布局抖动。
3、当图片无法加载时，alt属性内容会作为替代文字显示，对屏幕阅读器用户至关重要。
4、支持多种格式，如.jpg、.png、.svg，现代项目中推荐使用响应式图片语法<picture>配合<source>。
四、制作表单收集用户输入
表单是网站与用户交互的关键入口，HTML提供原生控件用于采集文本、选择选项、提交数据等操作。
1、用<form>包裹所有输入元素，并设置action属性指定数据提交地址，method指定请求方式（如POST）。
2、文本输入框使用<input type="text">，密码框使用<input type="password">。
3、单选按钮组需共享相同name值，例如name="gender"，确保同一时间仅能选中一项。
4、提交按钮使用<input type="submit">或<button type="submit">，点击后触发表单数据发送。
五、插入表格展示结构化数据
表格适用于呈现行列分明的信息，如价格对比、课程安排、统计结果等，HTML通过语义化标签明确数据关系。
1、用<table>作为容器，<thead>定义表头行，<tbody>包含主体数据行。
2、表头单元格使用<th>，默认加粗居中；普通数据单元格使用<td>。
3、跨列合并使用colspan="2"，跨行合并使用rowspan="3"，用于复杂表头设计。
4、为提升可访问性，应添加<caption>描述表格用途，例如<caption>2024年销售数据汇总</caption>。
