DOCTYPE小结,及DOCTYPE位置影响CSS菜单显示的问题

先复制几份比较好的文章:

 

 

文摘一:

XHTML代码头部Doctype文档类型声明必不可少!

CND8学院 HTML教程 发布日期:2008年11月04日


 

  HTML遵循一定的规则。这些规则包含在一个文档类型定义(Document Type Definition)文件中,或者如大家所知的DTD。DTD是一个XML文档,解释了哪些标签、属性或值对于HTML的一个特定类型是有效的。每一个HTML版本,都有一个对应的DTD。现在你可能会问:“所有这些和CSS又有什么关系呢?”

  如果想让网页中的所有内容都在网页浏览器上正确、一致地显示,就得告诉网页浏览器你正使用HTML或者XHTML的哪个版本,包括一个网页开头处的文档类型声明(doctype declaration)是什么意思。这个文档类型声明是在HTML文件的第一行,不仅定义你正使用的HTML版本(比如HTML 4.01 Transitional),而且指向网页中适当的DTD文件。当键错文档声明时,你会使大部分浏览器进入一个叫怪异模式(Quirks Mode)(译注1)的警告状态。

  怪异模式(Quirks Mode)是浏览器制造商为使他们的软件运行起来就像大约1999年(Netscape 4和Internet Explorer 5时代)时的浏览器所采用的方法。如果一个现代浏览器遇到一张没有正确文档类型的网页,它就会以为:“嗯,这张网页一定是很早很早以前用HTML编辑器写的。我得假装自己是一个真正很旧的浏览器来显示网页,就像那些bug重重的旧浏览器所显示的那样。”这就是为什么当没有一个正确的文档类型时,你用CSS进行样式设置的可爱网页,可能看起来并不像它根据当前的标准所应该显示的样子。当你在浏览器上检测时,无意中用怪异模式(Quirks Mode)浏览到你的网页,你可能会停止尝试去修正与不正确的文档类型有关、而不是不正当使用HTML或者CSS所引起的显示问题。

  注意:想了解更多关于怪异模式的相关信息,请访问www.quirksmode.org/index. html?/css/quirksmode.html 和 http://hsivonen.iki.fi/doctype/。

  所幸的是,获得正确的文档类型很简单。你所要知道的就是正在使用哪个HTML版本。最可能的是,你已经用HTML 4创建了网页。你甚至可能已经开始给你的网站使用XHTML(见第5页)。

  目前最流行的HTML和XHTML的版本是HTML 4.01 Transitional和XHTML 1.0 Transitional。这些HTML类型仍然让你使用展示型的标签,如<font>标签,在这方面还提供一个从旧版HTML到新版HTML的过渡:更严格的HTML和XHTML

  标签。虽然最好不要使用这些标签,但它们在Transitional版中仍然起作用,因此你可以根据自己的情况,逐步淘汰这些旧式标签。在严格版的HTML和XHTML中,有些旧式标签根本不起作用。

  注意:一般来说,HTML和XHTML的严格版均不接受仅使网页展现效果好看的标签和属性,如<font>标签和一个段落的置中属性。它们也不接受一些曾经流行的属性,比如一个链接的目标属性——让你在一个新窗口中打开链接。

  如果你正使用HTML 4.01 Transitional,就要在创建的每张网页的开头处键入下列文档类型声明:

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

  XHTML 1.0 Transitional的文档声明也与此相似,但它指向一个不同的DTD。给开始的<html>标签添加一些代码来识别网页所用的语言,这也是个好主意,就像这样:

<!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" xml:lang="en" lang="en">

  注意:如果你正在给网页使用框架(frame),那么你就要给框架设置使用一个文档类型。请见W3C网站中正确的文档类型列表清单:www.w3.org/QA/ 2002/04/valid-dtd-list.html。

  如果这整个讨论正让你头疼且累得合不上眼,那么只要确保使用以上所列的正确的文档类型,并且始终将它放在HTML文件的第一行(恰好在<html>标签的前面)就行了。如果你想要一个基本的模板,便于在创建HTML或者XHTML网页时使用,请访问本书的网站:www.sawmac.com/css/。事实上,使用正确文档类型来创建一个空白的HTML网页并保存在你的计算机上,是一个好主意。这样每当你需要创建一个新网页的时候就从它那里进行拷贝。使用一个HTML检验器,就像在第22页方框中所述的那样,也是确保你正确键入文档类型声明的一个好办法。

  注意:大部分可视的网页工具如Dreamweaver、GoLive和FrontPage,在创建一张新网页时都会自动添加一个文档类型声明。许多智能型的HTML文本编辑器都有添加文档类型的快捷方式。

 

 

 

文摘二:

XHTML1.0是HTML4.0的重新组织,算是HTML4.01的修正版,发行命名为XHTML1.0

  1. 所有卷标元素名称都使用小写
  2. 所有没有成对的空标签必须以 />结尾,<p></p>和<a href=”home.html”></a>
  3. 所有属性都必须有值
  4. 非卷标一部分的符号以编码表示
  5. 同一个id选择器不可重复使用
  6. 绝对不可省略双引号或单引号
  7. 标签必须是一对
  8. 图片卷标加上文字说明alt=”说明”
  9. 正确的卷标顺序
  10. 批注文字不可包含-符号
  11. 引入js的写法<script type=text/javascript”src=script.js></script>
  12. <embed>标签的争议

<embed>是Netscape的私有标签,W3C 从HTML3.2 HTML 4.01 到 XHTML 1.0 中都没有这个标签,所以使用<embed>的页面是不能通过标准测试。

W3C推荐使用 <object> 标签,用<object>插入flash影片的代码可以写为:

<object type=”application/x-shockwave-flash” data=”index.swf” width=”400″ height=”200″>

<param name=”movie” value=”index.swf” />

</object>

但这样的写法可能IE5/IE6 Win浏览器版本会出现问题。想要符合标准又能在任何浏览器下正常显示,以下几个连结点提供参考:以下几个连结点提供参考:

torresburriel.com

A List Apart

<embed>标签因为广大的受到运用,不再标准范围引起很大的争议,想要解决这个问题,只能等IE浏览器对<object>有更好的支持或者W3C愿意收录<embed>标签。

  1. XHTML 1.0文件类别声明的正确写法 (不可小写)

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd“>

 

 

文摘三:

CSS布局 声明文档类型描述(DTD)

CSS布局建立符合WEB标准的页面,一直是php100.com探讨的话题,今天说说声明文档类型描述(DTD)。

  所有的文件需要用文档类型定义(DTD)开始,来告诉浏览器打开页面时应遵循什么规则。

  当我们使用网页设计工具Dreamweaver 新建网页文档以后,你将会在新文档的首行看到DOCTYPE声明。

  DOCTYPE是文档类型的简写,它定义当前文档的基本类型。即,所有的文件都需要用文档类型定义(DTD)。

  其实DOCTYPE只是一组机器可读的规范,虽然中间包含了文件的URL,但浏览器不会去读取这些文件,仅用于识别,然后决定以什么样的规范去执行页面中的代码。

  "The DOCTYPE goes before the opening html tag at the top of the page and tells   the browser whether the page contains HTML, XHTML, or a mix of both, so that it   can correctly interpret the markup."

  我们常用的4种文档类型,来创建我们的网站

Copy code

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

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

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

  在4种文档类型中:

  HTML4.01提供了两种常用的DTD :

  (1).严格型(strict):要求严格的DTD,用户必须使用符合HTML4.01中定义的标签。

  (2).宽松行(loose):要求比较宽松的DTD,与以前的HTML其它版本兼容一些。

  XHTML1.0提供了两种常用的DTD :

  (1).过渡型(transitional):要求非常宽松的DTD,它允许用户继续使用HTML4.01的标签,但是要符合XHTML的写法。

  (2).严格型(strict)

DOCTYPE小结 - 而立不惑 - 而立不惑之间'700')this.width='700';if(this.height>'700')this.height='700';" border=0>

DTD表示文档类型的定义,它们定义XML,XHTML和HTML的特定的某一个版本中可以有什么,不可以有什么,在载入网页的时候,浏览器会用既定的声明规范去检查页面的内容,是不是有效,然后采取相应的措施与编码解释文档中的代码。

  对于它们是如何工作的,我们用不着深究,只要知道它们能保证我们开发出标准的网页和保证CSS的正确渲染。

  一般情况下,我建议读者选择过渡型文档类型,这种DTD比较宽松,也比较容易通过W3C的代码校验,比较适合目前国内开发环境和大多数开发人员的水平。

  当我们也要向strict水平发展呀!不过Adobe Dreamweaver CS3/CS4工具中默认的是strict。

  

 

 

再谈一下个人体会:

在jsp中要求<%@ page 要写在jsp文件最前面。在使用一个js的菜单时发现有的页面子菜单能弹出来,有的页面中子菜单显示不出来。经过同事比较发现,显示不出来的是DOCTYPE放在其它代码下面的,而能显示出来的是DOCTYPE放在其它代码上方的。再进一步测试,发现DOCTYPE放在

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

下方子菜单可以显示,放在

<%@ page import="xxx" %>

下方子菜单就不能显示了。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值