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

介绍 Html 和 Html 5 的关系与区别

news 2025/11/5 11:36:25

HTML（HyperText Markup Language）是构建网页的标准标记语言，而 HTML5 是 HTML 的最新版本，包含了一些新的功能、元素、API 和属性。HTML5 相对于早期版本的 HTML（比如 HTML4）有许多重要的改进和变化。以下是 HTML 和 HTML5 之间的一些主要区别：

1. 文档类型声明（Doctype）

HTML：HTML4 使用的是较为复杂的 DOCTYPE 声明，如：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

HTML5：HTML5 使用的是简化的 DOCTYPE 声明：

<!DOCTYPE html>

这个变化使得 HTML5 的文档声明更加简洁易读。

2. 语义化标签

  • HTML：HTML4 中没有很多语义化的标签，网页的结构通常是通过
    和 等标签来构建的，缺乏对页面内容的描述。
  • HTML5：引入了许多新的语义化标签，使得页面结构更加清晰、易读，且对搜索引擎优化（SEO）有帮助。常见的 HTML5 语义标签包括：
<header>：定义页面或部分的头部。
<footer>：定义页面或部分的底部。
<nav>：定义导航链接。
<article>：定义独立的内容块。
<section>：定义文档中的节或部分。
<aside>：定义与页面内容相关的附加信息，如侧边栏。
<figure> 和 <figcaption>：定义图像和图像的标题。

3. 多媒体支持

  • HTML：HTML4 没有原生支持音频和视频，通常需要使用插件（如 Flash）来播放多媒体内容。
  • HTML5：HTML5 引入了原生的多媒体元素，直接支持音频和视频播放，使用 和 标签。例如：
<audio controls><source src="audio.mp3" type="audio/mp3">Your browser does not support the audio element.
</audio><video controls><source src="video.mp4" type="video/mp4">Your browser does not support the video element.
</video>

4. 本地存储

  • HTML：HTML4 没有提供本地存储的功能，开发者通常依赖于 cookie 来存储数据，但 cookie 存储的数据量非常有限（通常为 4KB）。
  • HTML5：HTML5 引入了本地存储机制，提供了 localStorage 和 sessionStorage，这使得网页能够在用户的浏览器中存储大量数据，且存储的数据不会被清除直到主动删除：
	 localStorage：无过期时间的数据存储，数据在浏览器关闭后依然存在。sessionStorage：在会话期间存储数据，浏览器窗口关闭时数据会被清除。

5. 新的表单控件

  • HTML：HTML4 的表单控件相对基础，只支持传统的输入类型（如文本框、单选框、复选框、按钮等）。
  • HTML5：HTML5 引入了许多新的表单元素和输入类型，增强了表单功能。例如：
新的输入类型：email、tel、number、date、time、url、range 等。
新的表单控件：<datalist>（提供自动完成的输入框）、<progress>（显示进度条）、<meter>（显示度量数据）等。
<input type="email" placeholder="Enter your email">

6. Canvas 和 SVG

  • HTML：HTML4 没有内建的支持用于绘图和图形的功能。

  • HTML5：引入了 元素，允许开发者使用 JavaScript 绘制图形、图表、动画等。HTML5 还加强了对 SVG（可缩放矢量图形）的支持。

<canvas id="myCanvas" width="200" height="100"></canvas>

7. Web API（Web 应用接口）

  • HTML4：HTML4 没有提供直接的 Web 应用接口。
  • HTML5：HTML5 引入了许多新的 Web API，使得开发者可以实现更多的功能，例如：
Geolocation API：获取用户的位置信息。
Web Workers：实现多线程处理，提升应用性能。
WebSockets：进行实时双向通信。
File API：允许浏览器直接访问文件系统并读取文件。
Offline Storage：用于离线应用，允许将数据缓存到本地。

8. 移除了一些过时的元素和属性

  • HTML：HTML4 中有一些不再推荐使用的元素和属性，如 、
    、 等。 
<font>、<center>、<strike>
  • HTML5：移除了这些过时的元素和属性，推荐使用 CSS 来处理样式和布局。

9. 更好的兼容性

  • HTML5：HTML5 更加注重跨平台和跨设备的兼容性，支持现代浏览器、移动设备、触摸屏等设备，并且能更好地支持响应式设计。

10. 离线支持

  • HTML：HTML4 不支持离线应用。
  • HTML5：HTML5 引入了 AppCache 和 Service Workers，支持离线应用，使得应用在没有网络连接时依然能正常运行。

11. 总结

  • HTML 是构建网页的基础标准，它提供了网页结构和内容的基本定义。
  • HTML5 是 HTML 的最新版本，加入了许多新的功能和元素，如新的语义标签、音视频支持、表单控件、Canvas、Web API、离线支持等，使得开发更为现代化、功能更强大。

HTML5 的引入使得网页和应用变得更加丰富，支持多媒体、图形、动画、数据存储等功能，提升了用户体验，并且让开发者能够更方便地构建跨平台的网页和应用。

相关文章：

介绍 Html 和 Html 5 的关系与区别

HTML&#xff08;HyperText Markup Language&#xff09;是构建网页的标准标记语言&#xff0c;而 HTML5 是 HTML 的最新版本&#xff0c;包含了一些新的功能、元素、API 和属性。HTML5 相对于早期版本的 HTML&#xff08;比如 HTML4&#xff09;有许多重要的改进和变化。以下是…...

编程日记 2024/12/22 1:18:43

C05S13-MySQL数据库备份与恢复

一、MySQL数据备份 1. 数据备份概述 数据备份的主要目的是灾难恢复&#xff0c;也就是当数据库等出现故障导致数据丢失&#xff0c;能够通过备份恢复数据。 数据备份可以分为物理备份和逻辑备份。物理备份&#xff0c;又称为冷备份&#xff0c;需要关闭数据库进行备份&#…...

编程日记 2024/12/22 1:16:41

【MySQL — 数据库基础】深入理解数据库服务与数据库关系、MySQL连接创建、客户端工具及架构解析

目录 1. 数据库服务&#xff06;数据库&#xff06;表之间的关系 1.1 复习 my.ini 1.2 MYSQL服务基于mysqld启动而启动 1.3 数据库服务的具体含义 1.4 数据库服务&数据库&表之间的关系 2. 客户端工具 2.1 客户端连接MySQL服务器 2.2 客…...

编程日记 2024/12/22 1:15:40

Three.js相机Camera控件知识梳理

原文&#xff1a;https://juejin.cn/post/7231089453695238204?searchId20241217193043D32C9115C2057FE3AD64 1. 相机类型 Three.js 主要提供了两种类型的相机&#xff1a;正交相机&#xff08;OrthographicCamera&#xff09;和透视相机&#xff08;PerspectiveCamera&…...

编程日记 2024/12/22 1:14:39

Unity 开发Apple Vision Pro空间锚点应用Spatial Anchor

空间锚点具有多方面的作用 虚拟物体定位与固定&#xff1a; 位置保持&#xff1a;可以把虚拟物体固定在现实世界中的特定区域或位置。即使使用者退出程序后再次打开&#xff0c;之前锚定过的虚拟物体仍然能够出现在之前所锚定的位置&#xff0c;为用户提供连贯的体验。比如在一…...

编程日记 2024/12/22 1:13:38

BGP的六种状态分别是什么？

此文章主要简单介绍下BGP的六种状态 1.Idle BGP会话的初始状态&#xff0c;路由器在此状态下不与任何BGP邻居通信&#xff0c;通常标识会话还没有开始或由于错误而未能启动&#xff0c;一般来说&#xff0c;缺乏去往BGP对等体的路由是导致BGP路由器其状态一直处于idle状态的常…...

编程日记 2024/12/22 1:10:35

IDEA搭建SpringBoot，MyBatis，Mysql工程项目

目录 一、前言 二、项目结构 三、初始化项目 四、SpringBoot项目集成Mybatis编写接口 五、代码仓库 一、前言 构建一个基于Spring Boot框架的现代化Web应用程序&#xff0c;以满足[公司/组织名称]对于[业务需求描述]的需求。通过利用Spring Boot简化企业级应用开发的优势&…...

编程日记 2024/12/22 1:07:32

Reactor

文章目录 正确的理解发送double free问题 1.把我们的reactor进行拆分2.链接管理3.Reactor的理论 listensock只需要设置_recv_cb&#xff0c;而其他sock&#xff0c;读&#xff0c;写&#xff0c;异常 所以今天写nullptr其实就不太对&#xff0c;添加为空就没办法去响应事件 获…...

编程日记 2024/12/22 1:00:22

在ESP32使用AT指令集与服务器进行TCP/IP通信时，＜link ID＞ 解释

在ESP32使用AT指令集与服务器进行TCP/IP通信时&#xff0c;<link ID> 是一个非常重要的参数。它用于标识不同的连接实例&#xff0c;特别是在多连接场景下&#xff08;如同时建立多个TCP或UDP连接&#xff09;。每个连接都有唯一的<link ID>&#xff0c;通过这个ID…...

编程日记 2024/12/22 0:58:20

[SZ901] JTAG合并功能（类似FPGA菊花链）

SZ901 JTAG支持将JTAG端口组合&#xff0c;最多将四个JTAG变成一个 设置如下 Vivado 识别结果如下 两块板子&#xff0c;变成一组&#xff0c;&#xff0c;可以同时抓取信号&#xff0c;调试&#xff01; SZ901 已上架淘宝&#xff0c;搜素“SZ901”哦...

编程日记 2024/12/22 0:57:19

paimon中的Tag

TAG 在传统数仓场景中&#xff0c;从传统数据库中导入的事实表数据一般是全量导入&#xff0c;按天分区每天都存储一份全量数据&#xff0c;paimon对此提供了Tag机制&#xff0c;创建TAG时&#xff0c;会对当前数据做一份全量快照&#xff0c;在之后对表的数据进行更新也不会影…...

编程日记 2024/12/22 0:53:15

3分钟读懂数据分析的流程是什么

数据分析是基于商业目的&#xff0c;有目的地进行收集、整理、加工和分析数据&#xff0c;提炼出有价值的 信息的一个过程。整个过程大致可分为五个阶段&#xff0c;具体如下图所示。 1.明确目的和思路 在开展数据分析之前&#xff0c;我们必须要搞清楚几个问题&#xff0c;比…...

编程日记 2024/12/22 0:52:14

uniapp入门 01创建项目模版

0安装 hbuilder x 标准版 1.创建模版工程 2.创建官方 案例工程 index.uvuewen 文件解析 <!-- 模版 标签 --> <template><view></view></template><!-- 脚本 --> <script>export default {data() {return {}},onLoad() {},methods:…...

编程日记 2024/12/22 0:50:12

React 19新特性探索：提升性能与开发者体验

React作为最受欢迎的JavaScript库之一&#xff0c;不断推出新版本以应对日益复杂的应用需求。React 19作为最新的版本&#xff0c;引入了一系列令人兴奋的新特性和改进&#xff0c;旨在进一步提升应用的性能、开发效率和用户体验。 本文将深入探讨React 19的新特性&#xff0c;…...

编程日记 2024/12/22 0:49:11

Hive是什么，Hive介绍

官方网站&#xff1a;Apache Hive Hive是一个基于Hadoop的数据仓库工具&#xff0c;主要用于处理和查询存储在HDSF上的大规模数据‌。Hive通过将结构化的数据文件映射为数据库表&#xff0c;并提供类SQL的查询功能&#xff0c;使得用户可以使用SQL语句来执行复杂的​MapReduce任…...

编程日记 2024/12/22 0:46:08

[LeetCode-Python版] 定长滑动窗口1（1456 / 643 / 1343 / 2090 / 2379）

思路 把问题拆解成三步&#xff1a;入-更新-出。 入&#xff1a;下标为 i 的元素进入窗口&#xff0c;更新相关统计量。如果 i<k−1 则重复第一步。更新&#xff1a;更新答案。一般是更新最大值/最小值。出&#xff1a;下标为 i−(k-1) 的元素离开窗口&#xff0c;更新相关…...

编程日记 2024/12/22 0:39:02

imx6ull qt多页面控制系统（正点原子imx系列驱动开发）

开题答辩完了也考完了四六级&#xff0c;赶紧来更新一下一个月前留下的坑吧 QAQ首先&#xff0c;因为毕业设计需要用到这些知识所以就从网络上找了一个智能车机系统&#xff0c;借鉴了一下大佬的项目思路&#xff0c;缝缝补补一个月终于完成了这一内容。 在这里先感谢从两位大佬…...

编程日记 2024/12/22 0:33:56

OCR:文字识别

使用场景: 远程身份认证 自动识别录入用户身份/企业资质信息&#xff0c;应用于金融、政务、保险、电商、直播等场景&#xff0c;对用户、商家、主播进行实名身份认证&#xff0c;有效降低用户输入成本&#xff0c;控制业务风险 文档电子化 识别提取各类办公文档、合同文件、企…...

编程日记 2024/12/22 0:29:51

SQL Server通过存储过程实现自定义邮件格式并定时发送

在 SQL Server 中，可以通过存储过程实现自定义邮件格式并定时发送。这通常涉及以下几个步骤： 1. 配置 Database Mail：首先需要配置 SQL Server 的 Database Mail 功能。 2. 创建存储过程：编写存储过程来生成自定义邮件格式并发送邮件。 3. 设置 SQL Server 代理作…...

编程日记 2024/12/22 0:25:48

【进阶编程】MVC和MVVM实现前后端分离的实现

在 WPF 开发中&#xff0c;通常使用 MVVM&#xff08;Model-View-ViewModel&#xff09;架构来分离视图和业务逻辑&#xff0c;但在某些情况下&#xff0c;你可能希望将 MVC&#xff08;Model-View-Controller&#xff09;模式与 MVVM 结合使用。这种结合有时是为了兼顾不同的架…...

编程日记 2024/12/22 0:22:45

大话软工笔记—需求分析概述

需求分析&#xff0c;就是要对需求调研收集到的资料信息逐个地进行拆分、研究&#xff0c;从大量的不确定“需求”中确定出哪些需求最终要转换为确定的“功能需求”。 需求分析的作用非常重要&#xff0c;后续设计的依据主要来自于需求分析的成果&#xff0c;包括: 项目的目的…...

编程新知 2025/11/3 10:32:07

HTML 列表、表格、表单

1 列表标签 作用&#xff1a;布局内容排列整齐的区域 列表分类&#xff1a;无序列表、有序列表、定义列表。 例如&#xff1a; 1.1 无序列表 标签&#xff1a;ul 嵌套 li&#xff0c;ul是无序列表&#xff0c;li是列表条目。 注意事项&#xff1a; ul 标签里面只能包裹 li…...

编程新知 2025/11/4 5:06:59

MVC 数据库

MVC 数据库 引言 在软件开发领域，Model-View-Controller（MVC）是一种流行的软件架构模式，它将应用程序分为三个核心组件：模型（Model）、视图（View）和控制器（Controller）。这种模式有助于提高代码的可维护性和可扩展性。本文将深入探讨MVC架构与数据库之间的关系，以…...

编程新知 2025/10/30 4:58:11

Java 加密常用的各种算法及其选择

在数字化时代&#xff0c;数据安全至关重要&#xff0c;Java 作为广泛应用的编程语言&#xff0c;提供了丰富的加密算法来保障数据的保密性、完整性和真实性。了解这些常用加密算法及其适用场景&#xff0c;有助于开发者在不同的业务需求中做出正确的选择。​ 一、对称加密算法…...

编程新知 2025/10/24 19:46:10

使用 SymPy 进行向量和矩阵的高级操作

在科学计算和工程领域&#xff0c;向量和矩阵操作是解决问题的核心技能之一。Python 的 SymPy 库提供了强大的符号计算功能&#xff0c;能够高效地处理向量和矩阵的各种操作。本文将深入探讨如何使用 SymPy 进行向量和矩阵的创建、合并以及维度拓展等操作&#xff0c;并通过具体…...

编程新知 2025/11/3 2:07:14

在web-view 加载的本地及远程HTML中调用uniapp的API及网页和vue页面是如何通讯的？

uni-app 中 Web-view 与 Vue 页面的通讯机制详解 一、Web-view 简介 Web-view 是 uni-app 提供的一个重要组件&#xff0c;用于在原生应用中加载 HTML 页面&#xff1a; 支持加载本地 HTML 文件支持加载远程 HTML 页面实现 Web 与原生的双向通讯可用于嵌入第三方网页或 H5 应…...

编程新知 2025/8/6 2:19:46

【笔记】WSL 中 Rust 安装与测试完整记录

#工作记录 WSL 中 Rust 安装与测试完整记录 1. 运行环境 系统&#xff1a;Ubuntu 24.04 LTS (WSL2)架构&#xff1a;x86_64 (GNU/Linux)Rust 版本&#xff1a;rustc 1.87.0 (2025-05-09)Cargo 版本&#xff1a;cargo 1.87.0 (2025-05-06) 2. 安装 Rust 2.1 使用 Rust 官方安…...

编程新知 2025/10/28 6:00:57

论文阅读笔记——Muffin: Testing Deep Learning Libraries via Neural Architecture Fuzzing

Muffin 论文 现有方法 CRADLE 和 LEMON&#xff0c;依赖模型推理阶段输出进行差分测试&#xff0c;但在训练阶段是不可行的&#xff0c;因为训练阶段直到最后才有固定输出&#xff0c;中间过程是不断变化的。API 库覆盖低&#xff0c;因为各个 API 都是在各种具体场景下使用。…...

编程新知 2025/10/29 5:50:11

离线语音识别方案分析

随着人工智能技术的不断发展&#xff0c;语音识别技术也得到了广泛的应用&#xff0c;从智能家居到车载系统&#xff0c;语音识别正在改变我们与设备的交互方式。尤其是离线语音识别&#xff0c;由于其在没有网络连接的情况下仍然能提供稳定、准确的语音处理能力&#xff0c;广…...

编程新知 2025/9/22 13:00:25

水泥厂自动化升级利器：Devicenet转Modbus rtu协议转换网关

在水泥厂的生产流程中&#xff0c;工业自动化网关起着至关重要的作用&#xff0c;尤其是JH-DVN-RTU疆鸿智能Devicenet转Modbus rtu协议转换网关&#xff0c;为水泥厂实现高效生产与精准控制提供了有力支持。 水泥厂设备众多&#xff0c;其中不少设备采用Devicenet协议。Devicen…...

编程新知 2025/10/31 19:32:22