页面的兼容性从认识<!DOCTYPE>开始

今天为了css的布局的游览器兼容性调整了一晚上,怎么调怎么不对,四处找资料和解决方案,无意中发现通过IDE创建的页面没这个兼容性问题,然后我就不停找原因和缩小范围。最后,发现只发现<!DOCTYPE>有所区别,这是我以前写网页是很火大的一段文字,每次会情不自禁的删掉,经过研究后发现,千万不能小看<!DOCTYPE>

当您打开网易,新浪等网站的任何一个页面的源码时,第一行都会看到<!DOCTYPE....dtd>,很多人不明白这段话什么意思,有什么作用。而在自己做项目的时候根本不在乎<!DOCTYPE>,甚至特意删除<!DOCTYPE>,这里特别提醒您:您删除<!DOCTYPE>的时刻,正是灾难开始发生的时刻。 


<!DOCTYPE>在遵循标准的任何Web文档中,它都是一项必需的元素。<!DOCTYPE>会影响代码验证,并决定了浏览器最终如何显示你的Web文档。现在您明白了吧,当你删除了<!DOCTYPE>时,就是把如何展示您html页面的权利给浏览器!很恐怖吧,IE6,IE7,IE8,Firefox2,Firefox3,Chrome,有多少种浏览器,您的页面可能就会产生多少种展示方式。 

如果您的页面根本就没有<!DOCTYPE>,那么您考虑浏览器的兼容性,就是缘木求鱼,提高页面的兼容性从重视<!DOCTYPE>开始。 

能够见到的<!DOCTYPE>有以下这几种: 

HTML 2 
<!DOCTYPE html PUBLIC "-//IETF//DTD HTML 2.0//EN"> 
HTML 3.2 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN"> 
HTML 4.01 Strict, Transitional, Frameset 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> 
XHTML 1.0 Strict, Transitional, Frameset 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.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 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> 
XHTML 1.1 xhtml1.1,XHTML 1.1 plus MathML 2.0 plus SVG 1.1 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN" "http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.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">

xhtml1-strict:声明文档中不使用任何失效属性以及框架 
loose:声明文档使用一些失效元素包括显示 
xhtml1-transitional:声明文档使用一些失效元素并且使用框架 

建议您的页面都是用strict声明,这样可以最大限度的提高页面的兼容性,不过这样可能会造成您在编写html程序时必须非常严格。只有当strict声明太严格,给您编码和实现造成了困难,您可以使用transitional声明,否则坚持使用strict。 

最后再次声明: 
您删除<!DOCTYPE>的时刻,正是灾难开始发生的时刻。提高页面的兼容性从认识<!DOCTYPE>开始
原文地址:https://www.cnblogs.com/hainange/p/6152976.html