DOCTYPE和XHTML的相关认识

yizhihongxing

DOCTYPE 是一种文档类型定义,它使得浏览器知道文档使用哪种规范解析。在 HTML 中,DOCTYPE 是必须的,否则浏览器将无法正确显示页面。而在 XHTML 中,DOCTYPE 不仅是必须的,还与 XHTML 版本紧密相关。

常用的 DOCTYPE 有以下几种:

  • HTML5:<!DOCTYPE html>
  • HTML 4.01:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  • XHTML 1.0:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  • XHTML 1.1:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

一般情况下,我们推荐使用 HTML5 作为 DOCTYPE,因为它最简洁、最具可读性,并且支持最新的 HTML 特性。在任何情况下,必须确保 DOCTYPE 是正确的。

XHTML 是一种基于 XML 的 HTML 版本,它更严谨、更标准化,因此更容易与其他 XML 应用程序集成。XHTML 要求文档严格遵循 XML 规范,必须有正确的 DOCTYPE,不能包含任何错误的标签或属性,所有标签必须要有相应的结束标签。XHTML 支持 XML 命名空间,并使用更多的小写字母。

以下是两个示例说明:

示例 1:HTML5

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>HTML5 DOCTYPE 示例</title>
  </head>
  <body>
    <h1>Hello World!</h1>
  </body>
</html>

这是一个 HTML5 文档,它使用最简单的 DOCTYPE,只需指定 <!DOCTYPE html>,然后就可以使用 HTML5 特性,比如语义化标签、音视频元素、Canvas 元素等等。

示例 2:XHTML 1.0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <title>XHTML 1.0 DOCTYPE 示例</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  </head>
  <body>
    <h1>Hello World!</h1>
  </body>
</html>

这是一个 XHTML 1.0 文档,它必须有正确的 DOCTYPE,使用严格模式,所有标签和属性必须要符合 XML 的规范。XHTML 还需要在文档头指定 XML 命名空间 (xmlns="http://www.w3.org/1999/xhtml")和 XML 语言 (xml:lang="en")。这段示例代码不仅是 XHTML 1.0 严格模式的示例,也是 XML 的示例,XML 是一种通用的标记语言,广泛应用于数据存储和传输。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:DOCTYPE和XHTML的相关认识 - Python技术站

(0)
上一篇 2023年6月10日
下一篇 2023年6月10日

相关文章

  • React Native基础入门之初步使用Flexbox布局

    React Native是基于React的框架,用于构建原生移动应用程序。在React Native中使用Flexbox布局非常常见,本攻略将针对初学者介绍React Native中的Flexbox。 什么是Flexbox布局 在Web开发中,CSS的Flexbox布局是一种灵活的布局方式,它可以轻松创建弹性布局。在React Native中,同样采用Fle…

    css 2023年6月9日
    00
  • css3实现顶部社会化分享按钮示例

    本文主要讲解如何使用CSS3实现顶部社会化分享按钮,并提供两条示例说明。下面是操作步骤: 一、准备工作 首先,在html文件中加入如下代码: <head> <link rel="stylesheet" href="css/style.css"> </head> <body&gt…

    css 2023年6月10日
    00
  • react基本安装与测试示例

    以下是React基本安装和测试示例的完整攻略: 安装Node.js和npm 首先,你需要在你的计算机上安装Node.js和npm(包管理器),如果你已经安装过了,可以跳过这一步骤。 如果你还没有安装Node.js和npm,请参考以下步骤: 访问Node.js官网:https://nodejs.org/en/ 下载LTS版本的Node.js,根据你的操作系统选…

    css 2023年6月9日
    00
  • 网页添加CSS样式表的四种方法

    当我们建立一个网站时,我们需要对页面的样式进行设计和美化,以提高用户对网站的感知度和用户体验。在这个过程中,我们可以通过添加CSS样式表对网站进行样式的统一设置与优化。 网页添加CSS样式表的四种方法: 1.内联式方式 在HTML标签中通过style属性来设置CSS样式,此方式直接作用于当前标签,使用简单,但会导致HTML代码冗长,且样式难以维护。 示例代码…

    css 2023年6月10日
    00
  • 基于JavaScript实现游戏购物车效果详解

    基于JavaScript实现游戏购物车效果详解 背景介绍 本文介绍了如何使用 JavaScript 实现游戏购物车效果。该购物车效果可以用于游戏中的商城系统,用户在商城中选择游戏道具后,可以加入购物车等待结算。 实现步骤 HTML 页面准备 在 HTML 页面中准备两个结构 class 分别为 shop 和 cart,用于展示商城中的商品和购物车中的商品。 …

    css 2023年6月11日
    00
  • jquery插件tytabs.jquery.min.js实现渐变TAB选项卡效果

    使用jquery插件tytabs.jquery.min.js可以很方便地实现带渐变效果的TAB选项卡效果,具体攻略如下: 步骤一:引入tytabs.jquery.min.js文件和相关样式文件 在页面中引入tytabs.jquery.min.js文件以及相关的样式文件,例如: <link rel="stylesheet" href=…

    css 2023年6月10日
    00
  • HTML5 Convas APIs方法详解

    你好,关于“HTML5 Convas APIs方法详解”的攻略,我可以提供以下内容: HTML5 Canvas APIs方法详解 什么是HTML5 Canvas? HTML5提供了一个绘制图像的元素Canvas。Canvas本质是一块矩形区域,支持JavaScript脚本,通过脚本可以在Canvas上绘制各种图形。Canvas是HTML5中比较重要的一项技术…

    css 2023年6月10日
    00
  • 使用css如何操作Table没有外边框只有内边框

    在 CSS 中,我们可以使用 border-collapse 和 border-spacing 属性来操作表格的边框。下面是一个完整攻略,包含了如何使用 CSS 操作表格没有外边框只有内边框的过程和两个示例说明。 CSS 如何操作表格没有外边框只有内边框 我们可以使用 border-collapse 和 border-spacing 属性来操作表格的边框。b…

    css 2023年5月18日
    00
合作推广
合作推广
分享本页
返回顶部