很多的Web
designer在刚接触W3C标准的时候，都遇到过高度自适应的问题。因为div等对象的height:100%;并不能够直接产生实际效果，于是开始
怀疑浏览器是否支持height:100%;的编写方法？当然不是，最明显的例子就是table
height="100"是没有任何问题的。这是很令人烦恼的问题。我浏览了很多网站，包括www.w3cn.org等，有的解决办法是不断地修改
height的固定值，或者利用页面背景和div背景相同来欺骗浏览者的视觉，但都没有从根本上解决问题。今天从一本《CSS网站布局实录》上终于找到最
完美的解决办法，来看一下这段高度自适应的CSS代码：
html,body{
margin:0px;
height:100%;
}
#left {
background-color:#CCC;
width:300px;
height:100%;
float:left;
}
代码已经到了不能再简单的地步，对#left对象设置了height:100%;，然而也能够看见，同时设置了HTML与body的height:100%;，而这个就是高度自适应问题的关键所在。
分析：
一个对象高度是否可以使用百分比显示，取决于对象的父级
对
象，#left在页面中直接旋转在body之中，因此它的父级是body，而浏览器默认状态下，是没有给body一个高度属性的，因此当我们直接设
置#left为height:100%;时，不会产生任何效果，而当我们给body设置了100%之后，它的子级对象#left的
height:100%;便发生作用了，这便是浏览器解析规则引发的高度自适应问题。而代码中除了给body应用之外，还给HTML对象也应用相同的样式
设计，这样做的好处是使IE与firefox浏览器都能够实现高度自适应，而body却不是。另外，Firefox中的HTML标签不是100%高度，因
此给两个标签都定义为height:100%;以保证两个浏览器下均能够正常显示。
1.所有的标记都必须要有一个相应的结束标记
以前在HTML中，你可以打开许多标签，例如<p>和<li>而不一定写对应的</p>和</li>来关闭它们。但在XHTML中这是不合法的。XHTML要求有严谨的结构，所有标签必须关闭。如果是单独不成对的标签，在标签最后加一个"/"来关闭它。例如:
<br />&l ......
<div style="padding-top:5px;width:200px;height:15px;background-color:#ffeeee"> test </div>
以上代码在IE中和firefox会有不同的效果.最主要原因是firefox解释padding-top与IE的效果不同
fixfox对DIV总高度是padding-top+height的,而IE中,padding-top是包含在height中的,
要解决这一个矛盾,可以利用!imp ......
