• HTML <!DOCTYPE>标记


    本教程向大家解释了<!DOCTYPE>标记的语法及如何使用HTML <!DOCTYPE>。

    描述

    HTML <!DOCTYPE>标记一般放在HTML文档中的第一行。它告诉浏览器要编写文档的HTML版本,以便浏览器知道预期的内容。此标记通常也称为<!DOCTYPE>元素。

    句法

    <!DOCTYPE>标记的语法在所使用的HTML或XHTML版本之间有所不同。让我们看一下最常见的用法。

    HTML5中的语法为:

    html>

    HTML 4.01 Transitional中的语法为:

    HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

    XHTML 1.0 Transitional中的语法为:

    html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    XHTML 1.0 Strict中的语法为:

    html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    XHTML 1.1中的语法为:

    html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

    浏览器兼容性

    <!DOCTYPE>标记基本支持以下浏览器:

    • 谷歌浏览器Chrome
    • 安卓
    • Firefox(火狐)
    • Firefox移动版(Gecko)
    • Internet Explorer(IE)
    • Edge 手机版
    • Opera
    • Opera 手机版
    • Safari(苹果浏览器)
    • Safari手机

    例子

    我们将在下面讨论标记,并探讨在HTML5,HTML 4.01 Transitional,XHTML 1.0 Transitional,XHTML 1.0 Strict和XHTML 1.1中如何使用标记的示例。

    HTML5文件

    如果您使用HTML5创建了一个新网页,则您的<!DOCTYPE>标记可能如下所示:

    1. <!doctype html>
    2. <html>
    3. <head>
    4. <meta charset="UTF-8">
    5. <title>HTML5 Example by www.techonthenet.com</title>
    6. </head>
    7. <body>
    8. <h1>Heading</h1>
    9. <p>This is the content.</p>
    10. </body>
    11. </html>

    在此HTML5文档示例中,<!DOCTYPE>标记位于第一行,该行不包含在标记内。

    HTML 4.01 Transitional文档

    如果您在HTML 4.01 Transitional中创建了一个新网页,则您的<!DOCTYPE>标记可能如下所示:

    1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    2. <html>
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    5. <title>HTML 4.01 Transitional Example by www.techonthenet.com</title>
    6. </head>
    7. <body>
    8. <h1>Heading</h1>
    9. <p>This is the content.</p>
    10. </body>
    11. </html>

    在此HTML 4.01 Transitional Document示例中,<!DOCTYPE>标记位于第一行,该行不包含在标记内。

    XHTML 1.0 Transitional文档

    如果您在XHTML 1.0 Transitional中创建了一个新网页,则您的<!DOCTYPE>标记可能如下所示:

    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    5. <title>XHTML 1.0 Transitional Example</title>
    6. </head>
    7. <body>
    8. <h1>Heading</h1>
    9. <p>This is the content.</p>
    10. </body>
    11. </html>

    在此XHTML 1.0过渡文档示例中,<!DOCTYPE>标记位于第一行,该行不包含在标记中。

    XHTML 1.0 Strict文档

    如果您在XHTML 1.0 Strict中创建了一个新网页,则您的<!DOCTYPE>标记可能如下所示:

    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    5. <title>XHTML 1.0 Strict Example by www.techonthenet.com</title>
    6. </head>
    7. <body>
    8. <h1>Heading</h1>
    9. <p>This is the content.</p>
    10. </body>
    11. </html>

    在此XHTML 1.0 Strict Document示例中,<!DOCTYPE>标记位于第一行,该行不包含在标记内。

    XHTML 1.1文档

    如果您在XHTML 1.1中创建了一个新网页,则您的<!DOCTYPE>标记可能如下所示:

    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    5. <title>XHTML 1.1 Example by www.techonthenet.com</title>
    6. </head>
    7. <body>
    8. <h1>Heading</h1>
    9. <p>This is the content.</p>
    10. </body>
    11. </html>

    在此XHTML 1.1文档示例中,<!DOCTYPE>标记位于第一行,该行不包含在标记内。

    好了, 以上是本文所有内容,希望对大家有所帮助,也希望大家对码农之家多多支持,你们的支持是我创作的动力!祝大家生活愉快! 

  • 相关阅读:
    CalBioreagents ID蛋白抗体的功能和应用实例
    基于ES6的文章发布系统的设计与实现
    扬帆牧哲:商标转让和商标变更的概念
    【正点原子I.MX6U-MINI应用篇】3、Framebuffer应用编程,操作屏幕
    arping命令详解
    中断机制-中断协商机制、中断方法
    rust calcmine读取excel
    vim编译器工具
    springboot2.x+security+vue2.x后台管理框架---字典管理(四)
    Oracle Net Configuration Assistant 配置步骤
  • 原文地址:https://blog.csdn.net/wuxiaopengnihao1/article/details/126521900