html4和html5文档声明有啥不同_怎么区分两种文档头【说明】

发布时间 - 2025-12-31 00:00:00    点击率:
HTML4的DOCTYPE需严格匹配三种DTD之一并指向官方URL,否则触发怪异模式;HTML5仅支持,不校验DTD,纯为标准模式开关。

HTML4 的 有多种写法,且依赖 DTD 类型

HTML4 分为 Strict、Transitional、Frameset 三种 DTD, 必须完整声明并指向对应 DTD URL,否则浏览器可能触发怪异模式。常见写法如:



这些声明不仅区分语义严格程度,还直接影响 CSS 渲染行为(比如盒模型、height 解析方式)和 JS 的 document.body.clientHeight 等值。

关键点:

  • PUBLIC 后面的字符串是“公共标识符”,不是 URL,不能随意修改
  • URL 必须准确匹配 W3C 官方地址,本地或错误路径会导致 DTD 解析失败,退化为怪异模式
  • 大小写敏感:必须全大写 PUBLICEN,引号必须是英文双引号

HTML5 的 是唯一合法且大小写不敏感的声明

HTML5 彻底简化了文档类型声明,只接受一种形式:(推荐小写),其他任何变体(如加空格、换行、大写 HTML、带系统标识符)虽多数浏览器能容错,但不符合规范。

它不引用 DTD,也不做 DTD 校验,纯粹是触发标准模式的开关。例如:


以下写法虽常被容忍,但应避免:

  • (大小写混用,非规范)
  • (旧草案残留,已废弃)
  • (多余属性,无意义)

如何快速判断一个页面用的是 HTML4 还是 HTML5 文档头

直接看 开头是否包含 html 二字且无 PUBLIC 或 URL —— 是则大概率是 HTML5;若出现 HTML 4.01HTML 3.2Strict/Transitional 字样,或带有 "http://www.w3.org/..." 的 URL,则属于 HTML4(或更早)。

注意几个易误判点:

  • 存在 不代表就是 HTML5 —— HTML4 也能用(只是非标准)
  • 用了
    标签也不绝对,因为 HTML4 页面可通过 CSS 命名模拟语义,且部分浏览器对未知标签有容错渲染
  • document.doctype.systemId 在 HTML5 下为 null,HTML4 下通常为 DTD URL(可编程检测)

混用或写错文档声明的实际影响

最直接后果是触发怪异模式(Quirks Mode),导致盒模型、表格布局、字体继承等行为回退到 IE5.5 时代逻辑。Chrome/Firefox 会通过 document.compatMode 暴露状态:"CSS1Compat" 表示标准模式,"BackCompat" 即怪异模式。

典型症状包括:

  • div { width: 100px; padding: 10px; } 在怪异模式下总宽仍是 100px(IE5 盒模型)
  • tableborder-collapse 失效
  • font-size 在嵌套中异常放大或缩小

哪怕只多一个空格、少一个引号,或把 html 写成 HTML,都可能导致旧版 IE 或某些嵌入式 WebView 解析失败。所以,HTML5 就老老实实写 ,别加料。


# css  # html  # js  # html5  # 浏览器  # firefox  # chrome  # NULL  # 标识符  # 字符串  # 继承  # public 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: 原生JS获取元素集合的子元素宽度实例  专业企业网站设计制作公司,如何理解商贸企业的统一配送和分销网络建设?  网站建设整体流程解析,建站其实很容易!  网站制作报价单模板图片,小松挖机官方网站报价?  Laravel怎么生成二维码图片_Laravel集成Simple-QrCode扩展包与参数设置【实战】  百度输入法ai面板怎么关 百度输入法ai面板隐藏技巧  北京网站制作的公司有哪些,北京白云观官方网站?  Laravel如何清理系统缓存命令_Laravel清除路由配置及视图缓存的方法【总结】  使用PHP下载CSS文件中的所有图片【几行代码即可实现】  Windows驱动无法加载错误解决方法_驱动签名验证失败处理步骤  如何用AWS免费套餐快速搭建高效网站?  Mybatis 中的insertOrUpdate操作  如何在阿里云虚拟服务器快速搭建网站?  nodejs redis 发布订阅机制封装实现方法及实例代码  标题:Vue + Vuex 项目中正确使用 JWT 进行身份认证的实践指南  如何在阿里云购买域名并搭建网站?  Laravel如何使用Passport实现OAuth2?(完整配置步骤)  浅述节点的创建及常见功能的实现  Laravel如何使用Collections进行数据处理?(实用方法示例)  js实现获取鼠标当前的位置  微信推文制作网站有哪些,怎么做微信推文,急?  敲碗10年!Mac系列传将迎来「触控与联网」双革新  如何彻底卸载建站之星软件?  ,南京靠谱的征婚网站?  香港服务器网站推广:SEO优化与外贸独立站搭建策略  Win11怎么设置虚拟桌面 Win11新建多桌面切换操作【技巧】  武汉网站设计制作公司,武汉有哪些比较大的同城网站或论坛,就是里面都是武汉人的?  Laravel怎么自定义错误页面_Laravel修改404和500页面模板  如何在搬瓦工VPS快速搭建网站?  手机网站制作平台,手机靓号代理商怎么制作属于自己的手机靓号网站?  如何在 Go 中优雅地映射具有动态字段的 JSON 对象到结构体  如何在企业微信快速生成手机电脑官网?  如何在阿里云通过域名搭建网站?  如何在七牛云存储上搭建网站并设置自定义域名?  Edge浏览器提示“由你的组织管理”怎么解决_去除浏览器托管提示【修复】  简历在线制作网站免费版,如何创建个人简历?  详解Android中Activity的四大启动模式实验简述  简单实现Android验证码  Laravel如何处理文件下载请求?(Response示例)  利用python获取某年中每个月的第一天和最后一天  香港服务器建站指南:免备案优势与SEO优化技巧全解析  长沙企业网站制作哪家好,长沙水业集团官方网站?  javascript和jQuery中的AJAX技术详解【包含AJAX各种跨域技术】  公司网站制作价格怎么算,公司办个官网需要多少钱?  打造顶配客厅影院,这份100寸电视推荐名单请查收  Android自定义listview布局实现上拉加载下拉刷新功能  Python文件操作最佳实践_稳定性说明【指导】  如何在局域网内绑定自建网站域名?  百度输入法ai组件怎么删除 百度输入法ai组件移除工具  zabbix利用python脚本发送报警邮件的方法