`

XHTML与HTML之间的差异(转)

    博客分类:
  • AJAX
阅读更多

HTML融入了许多XML规范,XHTML与HTML 4.01标准没有太多的不同,你只需要注意以下几点,并养成良好的习惯就可以从HTML转变为XHTML。

  • XHTML元素必须被正确地嵌套。
  • XHTML元素必须被关闭。
  • 标记名和属性名必须用小写。
  • 属性值必须加引号。
  • 属性不能简写。
  • 使用XHTML DTD声明文档类型。

另外,有些使用方法在XHTML中不鼓励使用,虽然现在的版本还支持,但应该尽量避免使用。

1、XHTML元素必须被正确地嵌套

在HTML中,某些元素可以像这样彼此不正确地嵌套:

<b><i>This text is bold and italic</b></i>

在XHTML中,所有元素必须彼此正确地嵌套:

<b><i>This text is bold and italic</i></b>

2、XHTML元素必须被关闭

在XHTML中,所有成对儿的标记必须要保留结束标记,不能只写开始标记。比如:

<p>This is a paragraph

上面的写法中,<p>标记没有关闭,正确的写法是:

<p>This is a paragraph</p>

在XHTML中,所有单个的标记也必须关闭。比如:<br>应写为<br />,<img href="t.gif">应写为<img href="t.gif" />等。

注意:有些版本的浏览器不能识别类似<br/>的标记,但在“/>”前加个空格就能识别了,所以应写为<br />。

3、标记名和属性名必须用小写

<P ALIGN="CENTER">This is a paragraph</P>

上面的写法中,标记名p、属性名align都应该改成小写。

4、属性值必须加引号

<img href="t.gif" width="80" onclick="setImg('t.gif')" />

上面的写法中,各属性值的引号不能省略。如果属性值内部需要引号,可以改为单引号进行分界(注:也可以外面用单引号,内部用双引号)。

5、属性不能简写

在HTML中,有些属性只有单一固定的值,这时可以只写属性名,不写属性值,但在XHTML中应该完整书写。如:

<input type="radio" checked>

checked是一个简写的属性,在XHTML中应该改为:

<input type="radio" checked="checked" />

与此类似的属性还有 readonly、noresize、selected、disable 等。

6、使用XHTML DTD声明文档类型

在每个XHTML文档中都必须使用XHTML DTD声明文档的类型,这才能保证你制作的是XHTML网页。

 HTML/XHTML文档结构
回顶部

以下是HTML 4.01文档结构:

<! doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
 
</head>
<body>
 
</body>
</html>

以下是XHTML 1.0文档结构:

<! doctype html public "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 
</head>
<body>
 
</body>
</html>

doctype就是文档类型声明,前者声明文档是HTML 4.01,后者声明文档是XHTML 1.0。

在doctype声明中,声明了文档的根元素是 html,它在公共标识符被定义为 "-//W3C//DTD XHTML 1.0 Transitional//EN" 的DTD中进行了定义。浏览器将明白如何寻找匹配此公共标识符的DTD。如果找不到,浏览器将使用公共标识符后面的URL作为寻找DTD的位置。

注:doctype并非XHTML文档自身组成部分,它不是XHTML元素,不需要关闭。

<html>...</html>是文档的开始和结束,所有文档内容都放在这个区域里。

<head>...</head>是文档的头部,文档的说明和参数定义放在这个区域里。

<body>...</body>是文档的主体,需要在浏览器中显示的内容都放在这个区域里。

分享到:
评论

相关推荐

    WEB开发 之 XHTML 与 HTML 之间的差异.docx

    WEB开发 之 XHTML 与 HTML 之间的差异.docx

    XHTML 教程

    XHTML 教程 XHTML 是更严谨更纯净的 HTML 版本。 在此教程中,我们会为您讲解 HTML 与 XHTML 之间的差异,同时也会为您展示将该站点升级到 XHTML 的方法。

    如何正确地在XHTML文档中使用JavaScript和CSS

    在越来越多的网站中,XHTML的使用正以很快的速度替代HTML4,但是,目前一些主流浏览器对XHTML的支持还不是很好,加上一些网页制作者对XHTML和HTML4之间的差异理解不够,使得XHTML在WEB发展上进程变得缓慢。...

    Web程序设计计算机科学经典教材.doc

    cellspacing 57 2.8.5 表格分块 59 2.9 表单 59 2.9.1 标签 59 2.9.2 标签 60 2.9.3 标签 63 2.9.4 标签 65 2.9.5 动作按钮 66 2.9.6 一个完整的表单示例 66 2.10 HTML与XHTML之间的 语法差异 69 2.11 本章小结 71 ...

    HTML blockquote 标签使用与美化

    HTML 与 XHTML 之间的差异 没有。 提示和注释: 提示:请使用 q 元素来标记短的引用。 注释:如需把页面作为 strict XHTML 进行验证,那么 &lt;blockquote&gt; 元素必须包含块级元素,比如这样: 复制代码代码如下: ...

    详解HTML的input 标签及其禁用方法

    HTML 与 XHTML 之间的差异在 HTML 中,&lt;input&gt; 标签没有结束标签。在 XHTML 中,&lt;input&gt; 标签必须被正确地关闭。实例一个简单的 HTML 表单,包含两个文本输入框和一个提交按钮: XML/HTML Code复制内容...

    Web前端开发的关键技术.pdf

    Flutter技术的主要特点是它可以减少平台之间的差异,保持和原生开源平台的兼容性,并且能够提高网页设计的效率和速度。 Web前端开发的关键技术包括HTML、CSS、JavaScript、DOM、AJAX、Flutter等。这些技术都是现代...

    关于html中meta的作用(网上搜集整理得来)

    HTML 与 XHTML 之间的差异 在 HTML 中,&lt;meta&gt; 标签没有结束标签。 在 XHTML 中,&lt;meta&gt; 标签必须被正确地关闭。 提示和注释: 注释:&lt;meta&gt; 标签永远位于 head 元素内部。 注释:元数据总是...

    前端开发面试题含答案.pdf

    HTML 与 XHTML 方面: 1. 二者有什么区别 2. 你觉得应该使用哪一个并说出理由 JSON 方面: 1. 作用 2. 用途 3. 设计结构 JavaScript 方面: 1. 数据类型 2. 面向对象 3. 继承 4. 闭包 5. 插件 6. 作用域 7. ...

    iframe标签用法详解(属性、透明、自适应高度)

    HTML 与 XHTML 之间的差异 在 HTML 4.1 Strict DTD 和 XHTML 1.0 Strict DTD 中,不支持 iframe 元素。 提示和注释: 提示:您可以把需要的文本放置在 &lt;iframe&gt; 和 &lt;/iframe&gt; 之间,这样就可以应对...

    工程硕士学位论文 基于Android+HTML5的移动Web项目高效开发探究

    主要的工作是发展 Web 规范,这些规范描述了 Web 的通信协议(比如 HTML 和 XHTML)和其他的构建模块。 NativeApp 使用传统原生态Android SDK来实现的应用 WebApp 基于浏览器来实现的一种应用 HybridApp 一种可以...

    HTML元素 noscript使用介绍

    HTML 与 XHTML 之间的差异NONE提示和注释:注释:如果浏览器支持脚本,那么它不会显示出 noscript 元素中的文本。 注释:无法识别 [removed] 标签的浏览器会把标签的内容显示到页面上。为了避免浏览器这样做,您应当...

    CSS终极参考手册中文版

    一本非常详尽的css参考手册,主要介绍了css的作用、一般语法和术语、@规则、选择符、层叠与特性以及继承、css布局和格式化、各种css属性、html和xhtml之间的差异,以及规避方法、过滤器和各种技巧,适合各级网页设计...

    JS获取整个页面文档的实现代码

    innerText与textContent是在除FF之外的浏览器与FF之间的差异。 代码如下: var innerText = document.body.innerText ? ‘innerText’ : ‘textContent’; 上面的语句在开头处理以避免多次判断 demo贴图: demo: ...

    毕业设计订餐系统源码-frequently-asked-front-end-interview-questions:纽约地区前端开发人员面试常

    位置绝对/固定之间的差异 CSS 预处理器的优点 CSS3 中的新特性 显示多少属性 动画功能 div 与跨度 内联 vs 块 内部/外部样式表的优点 伪类 CSS 中的优先顺序 特异性 Javascript : == 与 === 的区别 关闭 模块化的 ...

    xml实验报告.docx

    能够编写基本的XML文档,了解XML的基本用途,在实验的过程中需要什么是XML、以及XML与HTML之间的差异。 2.2实验要求 要求:格式良好,包含XML声明、合理的元素嵌套结构、属性、注释、名称空间。能合理体现下列数据的...

    CSS3的column-fill属性对齐列内容高度的用法详解

    column-fill 属性, 指定列之间高度是否对齐时使用。&lt;规定如何对列进行填充&gt; ...DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transit

    asp.net知识库

    .net 2.0 访问Oracle --与Sql Server的差异,注意事项,常见异常 Ado.net 与NHibernate的关系? 动态创建数据库 SQL Server数据库安全规划全攻略 .net通用数据库访问组件SQL Artisan应用简介1 在Framework1.0下...

Global site tag (gtag.js) - Google Analytics