`

HTML5标准学习 – 文档结构

 
阅读更多

 

说起HTML的结构,很多人都能说得头头是道,一般来说答案可能是这样的:

一个DOCTYPE,一个html,里面有head和body元素。

这当然不能说是不正确的,但是如果问到一个最小的HTML源文件必须有哪一些东西的话,恐怕很少有人能正确地做出回答。

先来回答一下这个问题,一个最简的HTML5源码文件需要的内容如下:

<!DOCTYPE html>

是的,就这样,一个字符不多,一个字符不少,除了大小写可任意变化外,其他的任何内容都是不能变动的。

那么究竟是怎么样的规则,导致一个最简的源码文件必须有doctype声明呢?根据标准,一个HTML文档有如下内容组成(严格按照顺序):

  1. 一个BOM标记,且这个BOM标记必须为U+FEFF。
  2. 0-n个空格或注释。
  3. DOCTYPE声明。
  4. 0-n个空格或注释。
  5. 一个HTML元素。
  6. 0-n个空格或注释。

这里存在着一些和HTML4的不同,一个HTML4的最简源码文件是这样的:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                      "http://www.w3.org/TR/html4/loose.dtd">
<title>这里是标题</title>

两者的区别是显而易见的:

  • HTML5把DOCTYPE修改为更简单的<!DOCTYPE html>,这个已经众所周知了。
  • 在HTML4中多了一个<title>标签。

这里的重点就是<title>标签了,关于这个标签,在HTML4.01标准中是这么说的:

Every HTML document must have a TITLE element in the HEAD section.

也即是说,HTML4要求<title>标签是必须存在的。

而在HTML5的标准中,又是这么说的:

There must be no more than one title element per document.

HTML5中只设定了<title>标签数量的上限,却没有指明下限,也就是说,没有<title>的文档已经被视为一个合法的文档了。

对于DOCTYPE,HTML4中设定了6种DOCTYPE,HTML5中将DOCTYPE分为3种,这个在以后的章节中再具体说明。

再回过来看一下文档组成,除去0-n个空格或注释这样并没有多大意义的元素之外,组成的列表中还说明有一个HTML元素,但是最简的源码中却没有这东西。这是因为在HTML的规范中,一直存在“隐式标签”这样的概念,关于隐式标签,大致可以这么解释:

一部分元素,当满足特定的前提条件时,其开始标签或结束标签可以在源码中省略。在这种情况下,被省略的标签称为“隐式标签”。

需要注意的是,此处的省略指的是在源码中省略,而在最终成型的DOM树中,这个标签是存在的,因此才称为隐式标签。因此上面最简的源码结构,在生成DOM树后,其真正的结构是这样的:

<!DOCTYPE html>
<html>
    <head></head>
    <body></body>
</html>

最后,再总结一下XHTML中的一些规范:

  • 因为是XML,所以为了表示这是一个HTML文档,必须有一个命名空间,其值为http://www.w3.org/1999/xhtml
  • 因为是XML,所以MIME type不能是text/html了,text/xmlapplication/xmlapplication/xml+html都是比较好的选择。
  • 因为是XML,必须有根元素,根元素为<html>,即<html>的开始和结束标签不能省略了。
  • 因为是XML,所有元素只要有了开始标签,就不能没有结束标签,或者自闭合。
  • 因为是XML,所有元素都得严格遵守大小写,元素名称必须为小写。

因为是XML,文档变得严格了很多,也因为是XML,其可读性和规范性提高了不少。但最终,我们始终要在HTML的宽容性和XML的规范性之间找到最佳的平衡点,一味地追求极端始终是一个错误。

分享到:
评论

相关推荐

    HTML5 学习应用

    HTML5是Web开发领域的一个重要里程碑,它在2014年正式成为W3C推荐标准,极大地丰富了网页内容的展示..."HTML5 – Web开发步入新阶段.pdf"这个文档很可能包含了更深入的讲解和实例,建议仔细研读,结合实践加深理解。

    HTML5 and CSS3 for the Real World

    - **HTML5基础**:本书的第一章介绍了HTML5的基础知识,包括HTML5的基本结构、文档类型声明(`&lt;!DOCTYPE html&gt;`)以及新的元素和属性。 - **语义化标签**:从第二章到第三章,作者们详细讲解了HTML5新增的语义化标签...

    XHTML标准参考手册

    - `~&lt;h6&gt;`:标题元素,用于组织文档结构。 - `&lt;p&gt;`:段落元素,用于分隔连续的文本。 - `&lt;a&gt;`:超链接元素,链接到其他页面或资源。 - `&lt;img&gt;`:图像元素,插入图片。 - `&lt;ul&gt;`、`&lt;ol&gt;`和`&lt;li&gt;`:无序列表和...

    计算机【HTML语言】课件

    HTML,全称Hyper Text Markup Language,是用于创建网页的标准标记语言。HTML的出现极大地推动了互联网的发展,使得人们能够创建包含文本、图像、链接等多种元素的动态网页。它通过一系列的标记来描述文档的结构和...

    css教程–十步学会用css建站

    2. **创建文件目录**:按照标准的网站结构创建必要的文件夹如`css`、`images`等,并将HTML文件保存为`index.html`。 3. **设置网站容器**:在HTML文件中创建一个宽度为760px的容器,并在CSS文件中定义其样式。 - ...

    1 HTMLPrimerPDF

    ### HTML Primer PDF – 国外名牌大学CS系内部讲义第一章 #### 一、引言 本章作为HTML(超文本标记语言)的基础教程,旨在为读者提供一个使用HTML及创建网页文件的基本介绍。HTML是构成万维网文档的基础语言,通过...

    LotusDomino学习笔记.doc

    ### LotusDomino学习笔记知识点概览 #### 1. 选取视图的列的内容 (@Trim @DbColumn) - **@Trim**: 是一个内置的LotusScript函数,用于去除字符串两端的空白字符。 - **@DbColumn**: 此函数用于获取指定列的信息。...

    JAVA WEB 开发详解:XML+XSLT+SERVLET+JSP 深入剖析与实例应用.part5

    4.19.5 指定文档缩进 161 4.19.6 指定媒体类型 161 4.20 xslt中的函数 162 4.21 数字格式化 162 4.22 查询和分组 164 4.23 处理多个输入文档 172 4.24 jaxp中的xslt api 175 4.24.1 转换器工厂 175 4.24.2 ...

    JAVA WEB 开发详解

    - Schema是另一种定义XML文档结构的方法,功能更加强大且灵活,支持复杂的数据类型。 - **XPath与XSLT:** - XPath用于在XML文档中查找信息,就像SQL语言在数据库中查找信息一样; - XSLT(Extensible ...

    kadmin-free-responsive-admin-dashboard-template

    8. **文档支持**:Kadmin通常会提供详尽的文档,指导用户如何使用模板,包括安装步骤、组件使用方法、示例代码等,帮助开发者快速上手。 在实际项目中,你可以通过下载并解压Kadmin的压缩包文件(KAdmin),将其中...

    Javascript For Beginners

    ### JavaScript for Beginners – 关键知识点概述 #### 一、基础知识 - **JavaScript**:一种广泛应用于网页开发中的脚本语言,常用于实现网页交互性,提高用户体验。 - **HTML页面**:HTML(HyperText Markup ...

    Virtio.tar.gz

    Virtio是一个重要的虚拟化技术框架,主要用于提高虚拟机(VM)与宿主机之间...这个压缩包提供的文档将有助于读者深入学习和掌握这一技术,对于从事虚拟化工作或者对Linux系统感兴趣的人员来说是非常有价值的参考资料。

    Atina - Responsive Admin Template

    轻量级的代码结构,合理的资源加载策略,以及对CSS3和HTML5的充分利用,使得模板在保持功能强大的同时,也保证了页面加载速度。 五、兼容性和浏览器支持 Atina模板广泛支持现代浏览器,包括Chrome、Firefox、Safari...

    Cpp_Tutorial:示例C ++教程网页–来自w3schools.com的启发

    HTML(超文本标记语言)是用于创建网页的标准标记语言,与C++不同,它是解释性的,主要用于描述文档内容和结构。在构建交互式网页应用时,C++程序员可能会用到HTML配合JavaScript和CSS来实现前端部分。 【文件名列...

    JAVA WEB 开发详解:XML+XSLT+SERVLET+JSP 深入剖析与实例应用.part2

    4.19.5 指定文档缩进 161 4.19.6 指定媒体类型 161 4.20 xslt中的函数 162 4.21 数字格式化 162 4.22 查询和分组 164 4.23 处理多个输入文档 172 4.24 jaxp中的xslt api 175 4.24.1 转换器工厂 175 4.24.2 ...

    JAVA WEB 开发详解:XML+XSLT+SERVLET+JSP 深入剖析与实例应用.part3

    4.19.5 指定文档缩进 161 4.19.6 指定媒体类型 161 4.20 xslt中的函数 162 4.21 数字格式化 162 4.22 查询和分组 164 4.23 处理多个输入文档 172 4.24 jaxp中的xslt api 175 4.24.1 转换器工厂 175 4.24.2 ...

    Resume:这只是一种做法

    1. **HTML基础知识**:理解HTML的基本结构,如文档类型声明(&lt;!DOCTYPE html&gt;),HTML标签(如和),以及如何组织内容。 2. **CSS样式**:HTML通常与CSS(层叠样式表)结合使用,以控制元素的外观,如字体、颜色、...

    groovy 原版杂志 十月

    DOM是一种文档对象模型标准,用于表示XML或HTML文档结构。Groovy作为一门动态语言,能够以一种更加自然的方式操作DOM。本文首先回顾了第一部分中的主要内容,并在此基础上深入分析了Groovy处理DOM的高级技巧。通过对...

Global site tag (gtag.js) - Google Analytics