WEB开发中被忽视的DOCTYPE

WEB开发中被忽视的DOCTYPE,第1张

概述自己在做web开发的时候,往往着重于界面设计及数据逻辑上的处理,而对一些细节不是特别注意。 doctype就是其中一个: <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 1.doctype是什么 doctype标签 用来指定documen… 自己在做web开发的时候,往往着重于界面设计及数据逻辑上的处理,而对一些细节不是特别注意。

DOCTYPE就是其中一个:

<!DOCTYPE HTML PUBliC "-//W3C//DTD xhtml 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

1.DOCTYPE是什么

DOCTYPE标签 用来指定document的dtd(document Type DeFinition)的,写在每个HTML的最前面,形如:

<!DOCTYPE RootElement Availability "URI" [declarations]>

如几种常见的DOCTYPE:

HTML 4.01: Strict<!DOCTYPE HTML PUBliC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/HTML4/strict.dtd">

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

xhtml 1.1 Strict DTD<!DOCTYPE HTML PUBliC "-//W3C//DTD xhtml 1.1 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

2.DOCTYPE能做什么

有没有指定DOCTYPE,以及指定不同的DOCTYPE都会激活不同的浏览器模式,从而产生对一些对HTML,CSS和Js的影响,其中最著名的就是所谓的盒模型问题。

2.1为什么会有多种模式

在很久很久以前还是netscape和IE争霸天下的时代,由于太强大了,浏览器模式是由浏览器自己说了算的。时光流逝,转眼到了战国群雄的时代,大家发现如果都自己说了算的话天下就乱套了,就商量说推举个盟主吧,于是w3c就上台了。但是问题又来了,譬如IE,虽说再不能一头独大,向标准看齐是大势所趋,但是假如浏览器只支持标准的话,之前的许多页面又会产生一些问题。

于是DOCTYPE应运而生,假如没有指定任何DOCTYPE,就采用原先的模式,被称为怪癖模式(Quirks Mode),假如指定了DOCTYPE,就遵循标准,被称为标准模式或严格模式(Standards Mode)。期间,以Mozilla为代表的几位,觉得标准模式里诸如img的解析不是很合适,就保留了一些个人意见,在指定一些特定的DOCTYPE情况下,会采用一种准标准模式(Almost Standards Mode),具体情况请参考Activating browser Modes with DOCTYPE,或是@随网之舞的译文用DOCTYPE激活浏览器模式。

2.2不同模式的具体影响

@ppk大牛已经给我们做了很好的总结,Quirks mode and strict mode。

3.建议采用的DOCTYPE

<!DOCTYPE HTML>

理由:支持HTML5,在不识别的情况下,会采用严格模式。

再加入一些reset CSS,如img { display: block }解决浏览器兼容问题。

需要提醒注意的是,现在很多人使用的<!DOCTYPE HTML PUBliC "-//W3C//DTD HTML 4.0 Transitional//EN">以及<!DOCTYPE HTML PUBliC "-//W3C//DTD HTML 4.01 Transitional//EN">在几个主要浏览器下都只相当于怪癖模式,换句话说,可以不加。 总结

以上是内存溢出为你收集整理的WEB开发中被忽视的DOCTYPE全部内容,希望文章能够帮你解决WEB开发中被忽视的DOCTYPE所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://www.outofmemory.cn/web/1023104.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-23
下一篇 2022-05-23

发表评论

登录后才能评论

评论列表(0条)

保存