根本不存在 DIV + CSS 布局这回事
转:写的不错,对于网页开发有指导意义
在《欲练 CSS ，必先宫 IE》和《你有 <table /> 强迫症吗？》这两篇文章中，看到有不少评论用到div+CSS布局这个说法，用来和table布局比较。实际上div不是用来布局的，div只是用来表示一个其它元素都无法准确表达语意的一个块区，只有CSS是用于布局的，所以根本就不存在div+CSS布局这回事。反过来，table布局的时候经常依赖于CSS定义一个单元格的布局属性，所以可以说是table+CSS布局。也就是说，我们讨论的两种主流布局方法应该是纯CSS布局和table+CSS布局，如果你觉得你在用的是div+CSS布局，那么有可能你也有强迫症了。
接下来我们说说如何进行纯CSS布局，因为CSS布局依赖于XHTML，所以我们先要说说如何书写一个CSS无关的XHTML。其实书写CSS无关的XHTML并不难，虽然你不能再好像书写table布局代码那样集中精力于最重的视觉效果上，但其难度也不过是中学生写作文那样。
中学生写作文如何写呢？首先看看题目，然后想想整篇文章分为哪几个大的段落，每个大的段落说些什么，能够把你要说的东西说清楚。对于XHTML来说，这相当于用div把文档切割为几大块。这时候你不要想着这些div将构建一个怎样的DOM啊、CSS如何选择DOM中元素设置规则实现布局之类的事情，就大概划分一下文档的大区域就好了。
然后当然是用一些常用的手法来表现感情或者论证问题，这在XHTML中就是用特定的元素来完成一些常见的信息组织。下面就是信息组织形式与元素的对应列表。
img
作为内容的图片是一定要放到img里面的，这没有更好的选择了。然而如果图片不是作为内容，而是作为修饰性的，则千万不要用img。对于非内容的图片，应该在CSS中引用，而不在XHTML中出现。例如每一个导航链接有一个前导的箭头指示，那么这些箭头就应该通过CSS的background-image属性加上去，而不是直接作为img出现。
a
这也是一个非常准确定义的元素，链接都需要使用它。或许已经有很多人忘记了a的本意是锚点，其实这是一个十分有用的语义，你可以用它来标记文档中一些重要的引用位置。
ul, ol
ul和ol分别是什么意思呢？如果你回答不上来，却知道它们可以用来干什么，那证明你是被可视化工具宠坏了，要转换过来编写符合语义的XHTML需要先补充基础知识，这时候你最好先找一些看起来非常基础非常全面的XHTML书籍看看，因为没有扎实的基础你在上面构建更多的知识都是不牢固的。ul和ol其实分别代表unordered list和ordered list，也就是无序列表和有�
相关文档：
DOCTYPE 影响 CSS 处理
Firefox: div 设置 margin-left, margin-right 为 auto 时已经居中, IE 不行
Firefox: body 设置 text-align 时, div 需要设置 margin: auto(主要是 margin-left,margin-right) 方可居中
Firefox: 设置 padding 后, div 会增加 height 和 width, 但 IE 不会, 故需要用 !important 多设一个 heig ......
1.document.formName.item("itemName") 问题
说明:IE下,可以使用document.formName.item("itemName")或document.formName.elements["elementName"];Firefox下,只能使用document.formName.elements["elementName"].
解决方法:统一使用document.formName.elements["elementName"].
2.集合类对象问题
说明:IE下,可以使用() ......
<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 ......
很多的Web
designer在刚接触W3C标准的时候，都遇到过高度自适应的问题。因为div等对象的height:100%;并不能够直接产生实际效果，于是开始
怀疑浏览器是否支持height:100%;的编写方法？当然不是，最明显的例子就是table
height="100"是没有任何问题的。这是很令人烦恼的问题。我浏览了很多网站，包括www.w3cn.o ......
