margin:0 auto;不居中问题 DOCTYPE声明滴重要性
首先我们看看HTML发展史:
HTML是Web统一语言，这些容纳在尖括号里的简单标签，构成了如今的Web，1991年，Tim Berners-Lee编写了一份叫做“HTML标签”的文档，里面包含了大约20个用来标记网页的HTML标签。他直接借用SGML的标记格式，也就是 后来我们看到的HTML标记的格式。
从IETF到W3C：HTML 4之路
HTML 1并不曾存在，HTML的第一个官方版本就是由IETF（互联网工程任务组）推出的HTML 2.0。问世之前，这个版本中的很多细则已经被实现，比如，1994年的Mosaic浏览器已经实现了在文档中嵌入图片的方法，后来HTML 2.0便吸纳了img这个标签。
后来，W3C取代IETF的角色，成为HTML的标准组织，1990年代的后半页，HTML的版本被频繁修改，直到1999年的HTML 4.01， 至此，HTML到达了它的第一个拐点。
XHTML 1：XML风格的HTML
HTML在HTML 4.01之后的第一个修订版本就是XHTML 1.0，其中X代表“eXtensible”，扩展，当然也有人将之解读为 “eXtreme”，极端。XHTML 1.0是基于HTML 4.01的，并没有引入任何新标签或属性，唯一的区别是语法，HTML对语法比较随便，而 XHTML则要求XML般的严格语法。
使用严格的语法规范并非坏事，要求开发者使用单一的代码风格，比如，HTML4.01允许你使用大写或小写字母标识标记元素和属性，XHTML则只 允许小写字母。XHTML1.0的推出刚好碰上了CSS的崛起，Web开发设计者们开始意识到Web标准问题，基于XHTML的严格语法规范被视为编写 HTML代码的最佳实践。
W3C推出XHTML 1.1
如果说XHTML 1.0是XML风格的HTML，XHTML 1.1则是货真价实的XML。这意味着XHTML 1.1无法使用 text/htmlmime-type直接输出，然而，如果Web开发者使用XMLmime-type，则当时的主流浏览器，IE则压根不支持。看上 去，W3C似乎正在与当时的Web脱节。
文件类型描述
为了说明文档使用的HTML标准，所有HTML文档应该以“文件类型声明”（<!DOCTYPE>）开头，引用一个文件类型描述。举例来说：
<!DOCTYPE HTML>
此宣告说明这个文件是HTML5。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-
这个声明说明文档服从HTML 4.01的严格文件类型描述，这个标准是严格结构化的，使用CSS来做格式化。有时是否存在一个合适的文件类型描述会影响一个浏览器显示网页的方式。
除了HTML 4.01的严格文件类型描述之外，HTML 4.01也提供“过渡”和“框架集”文件类型描述。
<!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">
好了转入正题
比如，以下的内容是关于CSS布局居中的：
<style>
#cnbruce{width:500px; background-color: #ccc; margin: 0 auto}
</style>
<div id=”cnbruce”>margin: 0 auto 看看内容居中否</div>
如上调试结果，IE6.0是不居中的，当然解决的办法可以是对网页主体“<body>”声明文本居中，即
<style>
body{text-align:center}
#cnbruce{width:500px; background-color: #ccc; margin: 0 auto}
</style>
<div id=”cnbruce”>margin: 0 auto 看看内容居中否（加了body文本居中）</div>
然后，单个div的CSS居中，非要扯上<body>？
于是在不采用“<body>”声明文本居中的情况下，将DOCTYPE声明加上，立马有效果
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<style>
#cnbruce{width:500px; background-color: #ccc; margin: 0 auto}
</style>
<div id=”cnbruce”>margin: 0 auto 看看内容居中否（加了DOCTYPE声明）</div>
其实原理都知道，就是因为用这个“懒人”的HTML调试框，懒得去输入些忘却的东西，到头来还以为真相就是如此呢。。。
同样，关于“一边固定，一边自动扩展”的例子，加与不加在IE效果完全不同
如下是不加的情况：
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
<title>CSS布局</title>
<style type=”text/css”>
<!–
body {
margin:0;
}
#dv1 {
background-color: #3399FF;
float: left;
width: 280px;
}
#dv2 {
background-color: #FFCC00;
width:100%;
}
–>
</style>
</head>
<body>
<div id=”dv1″>
<pre>#dv1 {
background-color: #3399FF;
float: left;
width: 280px;
} </pre>
</div>
<div id=”dv2″>
<pre>#dv2 {
background-color: #FFCC00;
width:100%;
}
</pre>
</div>
</body>
</html>
如下是添加了DOCTYPE声明
<!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>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
<title>CSS布局1</title>
<style type=”text/css”>
<!–
body {
margin:0;
}
#dv1 {
background-color: #3399FF;
float: left;
width: 280px;
}
#dv2 {
background-color: #FFCC00;
width:100%;
}
–>
</style>
</head>
<body>