css布局调试有效方法divcss.docVIP

CSS 布局调试的有效方法 div+css 网页设计中 CSS 布局是很重要的部分，下边介绍几种 检查调试 CSS 布局的有效方法。 1. 检查 HTML 元素是 否有拼写错误、能否忘掉结束标志 即便是老手也常常会 弄错 div 的嵌套关系。 能够用 dreamweaver 的考证功能检查 一下有无错误。 2. 检查 CSS 能否书写正确 检查一 下有无拼写错误、能否忘掉结尾的 } 等。能够利用 CleanCSS 来检查 CSS 的拼写错误。 CleanCSS 本是为 CSS 减肥的工具， 但也能检查出拼写错误。 3. 用删除法确立 错误发生的地点 假如错误影响了整体布局，则能够逐一 删除 div 块，直到删除某个 div 块后显示恢复正常，即可确 定错误发生的地点。 4. 利用 border 属性确立犯错元素 的布局特征 使用 float 属性布局一不当心就会犯错。 这时 为元素增添 border 属性确立元素界限， 错误原由即真相大白。 5. float 元素的父元素不可以指定 clear 属性 MacIE 下假如 对 float 的元素的父元素使用 clear 属性，四周的 float 元素布局就会杂乱。 这是 MacIE 的有名的 bug ，若是不知道就会走 弯路。 6. float 元素务必指定 width 属性 好多阅读器 在显示未指定 width 的 float 元素时会有 bug 。所以不论 float 元素的内容如何，必定要为其指定  width  属性。  此外指 定元素时尽量使用  em  而不是  px  做单位。  7. float  元素 不可以指定 margin 和 padding 等属性 IE 在显示指定了 margin 和 padding 的 float 元素时有 bug 。所以不要对 float 元素指定 margin 和 padding 属性 (能够在 float 元素内部嵌套 一个 div 来设置 margin 和 padding) 。也能够使用 hack 方法 为  IE  指定特其他值。  8. float  元素的宽度之和要小于  100% 假如  float  元素的宽度之和正好是  100%  ，某些古老的阅读器 将不可以正常显示。 所以请保证宽度之和小于  99%  。  9. 是 否重设了默认的款式  ?  某些属性如  margin  、padding  等， 不同阅读器会有不同的解说。所以最幸亏开发前第一将全体 的 margin 、 padding 设置为 0、列表款式设置为 none 等。 10. 能否忘掉了写 DTD? 假如不论如何调整不同阅读器 显示结果仍是不同样，那么能够检查一下页面开头能否是忘 了写下边这行 DTD ： /TR/html4/loose.dtd