常见的CSS问题的“一站式”的解决方案

日期：2007年9月27日作者：查看:[大字体中字体小字体]

如果曾用CSS创建过一两个网站的话，那么很容易发现浏览器对CSS的支持仍远远称不上完美。取决于作品的复杂程度，最终很有可能导致这样的结局：沉陷于CSS的泥沼中，气愤得只想撞墙，并发发誓今后再也不会去做Web设计，甚至会觉得哪怕是城市规划或都核物理，都要比CSS简单、友好得多。

若处于这样的情绪中，那么请相信自己并不孤单。在我们背后，整个社区都在一刻不停地与基于标准设计中遇到的各种一倡百和着斗争，并分享着他们的成功经验。基于很多的现有资源，本书的合著者之一Dave Shea也整理出了一份资料，叫做“CSS Crib Sheet”。“CSS Crib Sheet”旨在为很多常见的CSS问题给出“一站式”的解决方案，下面我们应将其完整列出。“CSS Crib Sheet”的最新版本可以到www.mezzoblue.com/css/cribsheet访问。

若是不确信的，那么就去验证

在调试之前若能简单地难一下代码，将为我们减少很多头痛的经历，节省很多时间。格式不正确的XHTML或CSS将导致很多布局问题。这时，使用验证工具可以很愉找到并纠正这些错误。W3C提供了XHTML和CSS验证工具，可分别在http://validator.w3.org和http://jigsaw.w3.org/css-validator访问。

需要注意的是，由于不恰当的嵌套等原因，文档中较早出现的错误可能会导致随后更多的难失败，而这些难失败之处却并不一定是真正的错误。我们建议首先修复一些明显的错误，然后重新验证：这时错误总数可能会直线下降。

创建并测试CSS时，首先在最高级、最先进的浏览器中进行，然后再考虑其他浏览器

如果首先基于那些较为古老的浏览器创建并测试CSS的话，那么代码将无法避免地依赖于这些浏览器中落后、错误的呈现规则。这样随后在那些更先进、更遵守标准的浏览器中调整时，将变得举步维艰－－这无疑是一种倒退行为。

因此，若是首先基于先进浏览器编写，然后再为那些非标准浏览器调整的话，代码将从一开始就非常标准，调整的过程也会非常容易。就目前的实际情况看来，应该首先在Mozilla (Firefox), Safari或者Opera中测试，然后再在IE中调整。

若用浮动实现布局，请确保正确地清除了浮动

浮动的使用非常富有技巧性，而且它也并不总是那么“听话”。若某个浮动元素超过了预期的边界，或者不管由于什么别的原因与预期的表现行为不同的话，那么首先应该确认的就是预期目标的合理性与正确性。关于这个问题，请查看Eric Meyer在他的网站Complex Spiral Consulting 上的教程 (www.complexspiral.com/publications/containing-floats)。

为元素应用内边距或边框来避免外边距重叠

有时候元素之间留出了一条并不希望看到的缝隙，而别一些时候却无法让元素之间保持一段距离。若效果是由外边距实现的话，那么罪魁祸首十有八九就是外边距重叠现象。Andy Budd 在他的网站中详细解释了这一现象(www.andybudd.com/archives/2003/11/no_margin_for_error).

避免同时为元素指定明确的内边距/边框值与宽度/高度值

Windows平台上的IE5.0和IE5.5浏览器对盒模型的理解是错误的，因此当为元素指定了高度或宽度时，其结果往往不能如我们所愿。虽然对于这个问题已经有了一些权宜之计（请参考http://tantek.com/CSS/Examples/boxmodelhack.html）但最好还是从源头上避免。例如：若某元素需要固定的宽度/高度，那么既可以用其子元素的外边距值来撑大，也可以用其父元素的内边距值来约束。

避免IE6的“无样式内容瞬间”现象
[1] [2] [3] 下一页
常见的CSS问题的“一站式”的解决方案相关文章：
·QQ常在异地登录的原因及其应对方法
·防范黑客攻击Oracle系统的八大常用方法
·Windows Vista系统常用补丁功能介绍
·电脑摄像头日常保养六招秘诀
·CSS常见问题和技巧总结
·DIV+CSS常见错误汇总
·常用图片请入WPS 2007工具栏
·火拼QQ泡泡龙常见问题和解决办法
·远程工作站常见故障问题及排除方法
·QQ防盗措施及解决异常激活的办法
常见的CSS问题的“一站式”的解决方案相关软件
·猪蹄的十三种家常做法
·《常欢全集》典藏版v1.0
·《常见皮肤性病诊断与治疗》
·历史资料与历史常识
·佛教常识问答
·日常的佛心
·《股票常识与技术分析》
·《非常李咏》（新浪版）
·《非常年代的非常爱情》
·常用2500字行楷习字帖

上一篇:国外译文：网页设计如何使用CSS的选择器模式？

下一篇:当心被忽悠再谈如何删除WMP

特别声明：本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作
者.文章版权归文章原始作者所有.对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转
载的文章有版权问题请联系编辑人员,我们尽快予以更正. 转载请注明来源：http://www.hackhome.com

常见的CSS问题的“一站式”的解决方案

精品推荐

热点TOP10

特别推荐