HTML和HTML5有什么区别_html4与html5新特性对比【技巧】-html教程-PHP中文网

HTML5是底层重写而非升级补丁，需用和触发标准模式，语义标签、表单验证、音视频等特性须按浏览器实际兼容性谨慎落地。

html和html5有什么区别_html4与html5新特性对比【技巧】

HTML5 不是 HTML4 的“升级补丁”，而是从文档声明、语义结构到表单能力的一次底层重写。你只要改两行代码（ 和），浏览器就会切换到标准模式，后续所有新特性才真正生效——否则，哪怕写了

，IE9 以下照样当普通 div 渲染。

DOCTYPE 和字符集声明必须前置且极简

HTML4 的 DOCTYPE 是一长串带 URL 的 DTD 声明，稍有拼写错误或大小写混用（比如 DOCTYPE 写成 DocType），IE 就会退回到怪异模式（Quirks Mode），导致盒模型、浮动、CSS 计算全乱套。HTML5 只要 ，全小写、无空格、无 URL，浏览器立刻启用标准解析。

必须放在最前面（早于任何 CSS/JS 引入），否则 Safari、旧版 Chrome 可能按系统默认编码（如 ISO-8859-1）解码，中文直接变乱码。HTML4 的冗长且易漏写 http-equiv 或引号，还常被误插在里失效。

IE8 及更早版本不识别，必须用 HTML4 写法兜底（但此时已无法启用 HTML5 新标签）
若不在前 1024 字节内，部分浏览器会跳过解析
省略引号的写法如虽合法，但易引发属性值截断（比如 value="user name" 丢掉空格后半），不推荐生产环境使用

语义化标签不是“换汤不换药”的 div 替代

、、、这些标签自带隐式 ARIA 角色和 DOM 层级语义。屏幕阅读器会把当作导航区域单独播报，搜索引擎会把内容加权为独立内容单元。而

 在 DOM 树里只是个无意义容器，无障碍工具和爬虫完全无视。

 页面中只能出现一次，重复会导致辅助技术混淆

 应包裹主要导航链接，页脚的“关于我们”“隐私政策”不算，得用 


 必须有标题（–），否则语义断裂，不如直接用 
IE8 及以下不识别这些标签，需用 document.createElement('header') 注册，或引入 html5shiv.js

原生表单验证和输入类型实际可用但有坑
HTML5 表单控件如 、、 在现代浏览器中会触发 UI 提示和基础校验，但行为差异极大：

											
												
												
													DeepBI DHTML 页面生成器
													生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力：

- 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面；  
- 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”；  
- 提及位于 `apps/console/src/featur
												
												下载
												
											
										


 在 Safari 和 Firefox 中仍显示为文本框，无日期弹出层，必须用 JS 库（如 flatpickr）fallback

pattern 属性只支持 JavaScript 正则语法（不支持 \p{Han} 等 Unicode 属性类），且错误提示文案不可定制

min/max 对 type="number" 有效，但对 type="text" 无效；用户仍可手动输入超限值，需配合 JS 再校验
移动端键盘类型由 type 决定（email 弹邮箱键盘，tel 弹数字键盘），但 iOS 上 type="number" 会强制显示小数点按钮，影响整数输入体验

video/audio 和 canvas 的兼容性不能只看“是否支持”
 标签本身被广泛支持，但视频格式支持度天差地别：mp4（H.264）兼容性最好，webm（VP8/VP9）在 Chrome/Firefox 行，Safari 却长期不支持 VP9； 同理，ogg 在 Safari 上直接不播放。只写一个  标签等于放弃部分用户。


 是位图绘制 API，适合游戏、图表、图像处理；SVG 才适合图标、响应式矢量图——两者定位不同，不能互换

 内容无法被搜索引擎索引，也不具备可访问性，关键信息（如数据图表标题）必须额外用  或 ARIA 标注
所有  都应提供 ，否则字幕功能在 Chrome 中默认关闭，且需确保 VTT 文件编码为 UTF-8 BOM-free

最常被忽略的是：HTML5 特性不是“开了就自动好用”。
 多写一个会破坏语义， 在 Safari 里形同虚设， 不配多格式 source 就等于没做兼容。真正的落地，永远卡在“浏览器实际怎么执行”和“用户真实怎么用”之间。