当前位置：首页 > article >正文

HTML5全面知识点

article 2024/12/23 13:01:19

HTML（HyperText Markup Language）是构建网页的基础语言。以下是全面的 HTML 知识点：

一、HTML 基础概念

定义：HTML 是一种用于描述网页结构的标记语言，通过各种标签来定义网页的内容和布局。
版本历史：从 HTML 的早期版本发展到现在的 HTML5，功能不断增强，支持更多的多媒体和交互特性。

二、HTML 文档结构

<!DOCTYPE html>声明：用于告诉浏览器文档类型是 HTML5。
<html>标签：整个 HTML 文档的根元素。
<head>部分：
- <title>标签：定义网页的标题，显示在浏览器标签栏上。
- <meta>标签：提供关于文档的元数据，如字符编码、视口设置、搜索引擎优化信息等。
- <link>标签：用于链接外部样式表、图标等资源。
- <script>标签：可以包含 JavaScript 代码或链接外部脚本文件。
<body>部分：包含网页的可见内容。

三、HTML 标签分类

标题标签（<h1> - <h6>）：用于定义不同级别的标题。
段落标签（<p>）：定义段落文本。
文本格式标签：
- <strong>和<b>：用于加粗文本。
- <em>和<i>：用于斜体文本。
- <u>：用于添加下划线。
- <sup>和<sub>：用于上标和下标。
- <del>和<ins>：用于删除线和下划线表示插入内容。
列表标签：
- 无序列表（<ul>）和有序列表（<ol>），分别使用<li>标签定义列表项。
- 定义列表（<dl>）、定义术语（<dt>）和定义描述（<dd>）用于创建术语和描述的列表。
链接标签（<a>）：用于创建超链接，属性href指定链接目标。
图像标签（<img>）：用于在网页中插入图像，属性src指定图像路径，alt提供替代文本。
表格标签：
- <table>：定义表格。
- <tr>：定义表格行。
- <th>：定义表头单元格。
- <td>：定义表格数据单元格。
表单标签：
- <form>：创建表单，可包含各种输入元素。
- <input>：用于输入文本、密码、复选框、单选按钮等。
- <textarea>：用于输入多行文本。
- <select>和<option>：用于创建下拉列表。
- <button>：创建按钮。
语义化标签（HTML5 新增）：
- <header>：定义文档或章节的头部。
- <nav>：定义导航链接部分。
- <section>：定义文档中的节。
- <article>：定义独立的内容块，如文章、博客帖子等。
- <aside>：定义与页面主要内容相关的侧边栏内容。
- <footer>：定义文档或章节的底部。

四、HTML 属性

通用属性：
- id：为元素提供唯一的标识符，可用于在 CSS 和 JavaScript 中定位元素。
- class：为元素指定一个或多个类名，用于样式化和脚本操作。
- style：用于直接为元素应用内联 CSS 样式。
- title：为元素提供提示信息，当鼠标悬停在元素上时显示。
特定元素属性：不同的 HTML 元素有特定的属性，如<img>的src、alt、width、height，<a>的href、target等。

五、HTML 多媒体

音频（<audio>标签）：用于在网页中播放音频文件。
视频（<video>标签）：用于在网页中播放视频文件。

六、HTML 表单

表单元素类型：
- 文本输入框（<input type="text">）。
- 密码输入框（<input type="password">）。
- 复选框（<input type="checkbox">）。
- 单选按钮（<input type="radio">）。
- 提交按钮（<input type="submit">）。
- 重置按钮（<input type="reset">）。
- 文件上传（<input type="file">）。
表单属性：
- action：指定表单提交的目标 URL。
- method：指定表单提交的方法，如GET或POST。
- enctype：指定表单数据的编码类型，用于文件上传等情况。