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

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

news 2025/11/5 16:53:53

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

日语AI面试高效通关秘籍：专业解读与青柚面试智能助攻

在如今就业市场竞争日益激烈的背景下&#xff0c;越来越多的求职者将目光投向了日本及中日双语岗位。但是&#xff0c;一场日语面试往往让许多人感到步履维艰。你是否也曾因为面试官抛出的“刁钻问题”而心生畏惧&#xff1f;面对生疏的日语交流环境&#xff0c;即便提前恶补了…...

编程新知 2025/11/3 3:22:48

CVPR 2025 MIMO: 支持视觉指代和像素grounding 的医学视觉语言模型

CVPR 2025 | MIMO&#xff1a;支持视觉指代和像素对齐的医学视觉语言模型 论文信息 标题&#xff1a;MIMO: A medical vision language model with visual referring multimodal input and pixel grounding multimodal output作者&#xff1a;Yanyuan Chen, Dexuan Xu, Yu Hu…...

编程新知 2025/10/6 14:17:21

连锁超市冷库节能解决方案：如何实现超市降本增效

在连锁超市冷库运营中&#xff0c;高能耗、设备损耗快、人工管理低效等问题长期困扰企业。御控冷库节能解决方案通过智能控制化霜、按需化霜、实时监控、故障诊断、自动预警、远程控制开关六大核心技术&#xff0c;实现年省电费15%-60%&#xff0c;且不改动原有装备、安装快捷、…...

编程新知 2025/9/18 22:35:44

新能源汽车智慧充电桩管理方案：新能源充电桩散热问题及消防安全监管方案

随着新能源汽车的快速普及&#xff0c;充电桩作为核心配套设施&#xff0c;其安全性与可靠性备受关注。然而&#xff0c;在高温、高负荷运行环境下&#xff0c;充电桩的散热问题与消防安全隐患日益凸显&#xff0c;成为制约行业发展的关键瓶颈。 如何通过智慧化管理手段优化散…...

编程新知 2025/10/31 15:57:04

【AI学习】三、AI算法中的向量

在人工智能&#xff08;AI&#xff09;算法中&#xff0c;向量&#xff08;Vector&#xff09;是一种将现实世界中的数据&#xff08;如图像、文本、音频等&#xff09;转化为计算机可处理的数值型特征表示的工具。它是连接人类认知&#xff08;如语义、视觉特征&#xff09;与…...

编程新知 2025/8/12 22:58:13

OpenPrompt 和直接对提示词的嵌入向量进行训练有什么区别

OpenPrompt 和直接对提示词的嵌入向量进行训练有什么区别 直接训练提示词嵌入向量的核心区别 您提到的代码： prompt_embedding = initial_embedding.clone().requires_grad_(True) optimizer = torch.optim.Adam([prompt_embedding...

编程新知 2025/7/4 0:50:01

是否存在路径（FIFOBB算法）

题目描述 一个具有 n 个顶点e条边的无向图&#xff0c;该图顶点的编号依次为0到n-1且不存在顶点与自身相连的边。请使用FIFOBB算法编写程序&#xff0c;确定是否存在从顶点 source到顶点 destination的路径。 输入 第一行两个整数&#xff0c;分别表示n 和 e 的值&#xff08;1…...

编程新知 2025/10/1 6:09:21

.Net Framework 4/C# 关键字（非常用，持续更新...）

一、is 关键字 is 关键字用于检查对象是否于给定类型兼容，如果兼容将返回 true，如果不兼容则返回 false，在进行类型转换前，可以先使用 is 关键字判断对象是否与指定类型兼容，如果兼容才进行转换，这样的转换是安全的。 例如有：首先创建一个字符串对象，然后将字符串对象隐…...

编程新知 2025/9/25 18:41:38

云原生玩法三问：构建自定义开发环境

云原生玩法三问&#xff1a;构建自定义开发环境 引言 临时运维一个古董项目&#xff0c;无文档&#xff0c;无环境&#xff0c;无交接人&#xff0c;俗称三无。 运行设备的环境老&#xff0c;本地环境版本高&#xff0c;ssh不过去。正好最近对 腾讯出品的云原生 cnb 感兴趣&…...

编程新知 2025/11/1 1:02:35

Java求职者面试指南：Spring、Spring Boot、MyBatis框架与计算机基础问题解析

Java求职者面试指南&#xff1a;Spring、Spring Boot、MyBatis框架与计算机基础问题解析 一、第一轮提问&#xff08;基础概念问题&#xff09; 1. 请解释Spring框架的核心容器是什么&#xff1f;它在Spring中起到什么作用&#xff1f; Spring框架的核心容器是IoC容器&#…...

编程新知 2025/10/4 21:24:40