DOCTYPE和XHTML的相关认识

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日

相关文章

  • 利用CSS3实现平移动画效果示例代码

    下面是利用CSS3实现平移动画的完整攻略: 介绍 CSS3提供了大量的动画效果,其中平移动画是比较常用的一种。平移动画可以使元素在水平或垂直方向上移动,以实现各种效果。在本篇攻略中,我们将介绍如何使用CSS3实现平移动画,并提供两个示例代码。 实现方式 平移动画可以使用CSS3中的transition或animation来实现,这两种方式都需要在CSS样式中…

    css 2023年6月10日
    00
  • CSS圆形缩放动画简单实现

    下面是“CSS圆形缩放动画简单实现”的完整攻略。 概述 CSS圆形缩放动画,可以用来为网站增加动态效果,让页面更加生动有趣。实现这种动画效果,可以结合 CSS3 中的动画属性和 transform 属性。下面将详细介绍如何实现这种动画效果。 实现步骤 1. 创建HTML结构 首先给缩放的圆形添加一个HTML结构,我们可以用 标签来实现。此外,还要在HTML头…

    css 2023年6月10日
    00
  • CSS浮动引起的高度塌陷问题

    CSS浮动引起的高度塌陷问题是我们在进行页面布局时常常会遇到的问题。这种情况会导致元素高度不稳定,影响页面的美观和用户体验。下面是一份完整攻略,希望能够帮助您更好地理解和解决这个问题。 什么是高度塌陷问题? CSS浮动引起的高度塌陷问题是指,当我们设置了一个元素为浮动元素后,其它元素的高度和位置受到影响,可能会出现“塌陷”的情况。具体表现为: 父元素高度不被…

    css 2023年6月10日
    00
  • jQuery CSS()方法改变现有的CSS样式表

    下面是关于“jQuery CSS()方法改变现有的CSS样式表”的完整攻略: 1. 什么是jQuery CSS()方法? 在jQuery中,CSS()方法用来获取或设置一个或多个元素的CSS属性。这个方法接受两个参数:CSS属性和值。可以在一个CSS属性和值的对象上调用CSS()方法,也可以在两个单独的参数上调用。例如: $( "p" )…

    css 2023年6月9日
    00
  • 详解一级导航的制作

    一级导航是网站设计中非常重要的组成部分,它可以让用户轻松地找到自己需要的内容。下面介绍一下制作一级导航的详细攻略。 1. 确定导航分类 在制作一级导航时,首先需要确定网站的分类,这样才能为导航条提供具体的内容。对于新手来说,最好不要过多地划分分类,以免用户在使用网站时产生疑惑。例如一个简单的分类可以是:首页、产品、新闻等。 2. 设计导航条 在确定分类之后,…

    css 2023年6月10日
    00
  • JavaScript实现图片轮播特效

    首先,实现图片轮播特效需要以下几个步骤: HTML 结构 首先,我们需要在 HTML 文件中定义图片轮播容器,一般是一个 div 元素,里面包含多个 img 元素,每个 img 元素代表一张图片。例如: <div class="slider"> <img src="img1.jpg" alt=&quo…

    css 2023年6月10日
    00
  • css3中的calc函数浅析

    CSS3中的calc()函数浅析 calc() 函数在 CSS3 中是一个非常实用的函数,它可以用于简便地计算两个或多个值之间的运算。下面将从如下几个方面来讲解calc()函数: 什么是calc()函数及其语法 示例演示 注意事项 1. 什么是calc()函数及其语法 calc() 函数用于计算CSS属性值。有时候我们需要在样式表中写入数学表达式,比如计算一…

    css 2023年6月10日
    00
  • li样式不显示使用overflow:hidden导致Li前面点、圈等样式不见

    这个问题通常出现在给<ul>或者<ol>元素设置了一个宽度,然后想在其中的<li>元素中显示特定的样式,但是发现点、圈等样式不显示出来,只显示了一个空白。 其中原因是,当<li>元素的宽度超出了<ul>或<ol>元素的宽度时,<li>元素会溢出,而溢出的部分不会显示任何样式,…

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