当前位置：首页 → 问答吧 → 我个人总结的浏览器兼容性问题

我个人总结的浏览器兼容性问题

时间：2010-09-07

来源：互联网

本人不才，用DIV+CSS做的网站不多，总结下兼容性问题：

兼容性问题我目前碰到的主要由两个方面组成：
1、float浮动后导致的问题，总体名称应该是“文档流”的问题。
2、盒子模型导致的问题，border、padding
3、各个浏览器默认值导致的问题

我采集的做法虽然很笨但勉强能够解决问题：
1、文档流的问题，我尽量给各个元素把“框”的高宽固定，这样文档流维持原状，一般不会出布局方面的差错了。一些小问题分析下基本能解决。
2、盒子模型的问题,盒子模型主要针对border、padding的，目前个人做法是，尽量不用padding，因为他是有歧义的东西，我用margin，这样能解决很多问题
3、默认值，在CSS头部文件就生成好了

网上有很多办法，可我越看越复杂，请高手能够总结下，hack、这些东西我从来没用过

作者: zhuhaisto 发布时间: 2010-09-07

学习了。多些分享。

作者: ttaotao 发布时间: 2010-09-07

”目前个人做法是，尽量不用padding，因为他是有歧义的东西，我用margin，这样能解决很多问题“
？
求正解

作者: lqshmily 发布时间: 2010-09-07

楼主一二的做法全部欠考虑，验证完毕。

作者: xmlovedoudou 发布时间: 2010-09-07

难道margin不比padding问题更多？

作者: tonijoy 发布时间: 2010-09-07

2、盒子模型的问题,盒子模型主要针对border、padding的，目前个人做法是，尽量不用padding，因为他是有歧义的东西，我用margin，这样能解决很多问题
我跟你相反我用padding不用margin margin在FF和IE上也是有却别的双重使用

作者: ebfming3 发布时间: 2010-09-07

1、定义宽高数据是动态的岂不会有更多问题?
2、padding为什么有歧义呢？我是用padding多余margin

作者: eastnx 发布时间: 2010-09-07

对于楼主的第1.2点我说下我的观点
1，浮动之后产生的问题，解决的办法有很多，视具体问题而定，
但通常情况不要把盒子的高度的定死，你要考虑后期网站页面的易用性、可用性、复用性。。。
2，在固定了宽度后，尽量不要使用padding，这是因为标准浏览器跟IE浏览器对盒子的宽度解析不同；但不是说就只用margin

作者: taoqun 发布时间: 2010-09-07

谢谢楼主的分享。

--------------------------------------

由于float而产生的问题一般有两种情况，你掌握足够的方法解决他们就不会因为float而烦恼了：
1. ie6 双倍边距的问题：在float对象上使用display:inline;就能解决了。
2. 清除浮动（自己搜索，网上很多总结）

设置高宽确实有助于简单的排版的理解，但多数网页的开发过程中讲究高度自适应内容、宽度自适应分辨率等，设置高宽并非明智的做法。

--------------------------------------

楼上几位都说得不错，margin比padding产生的bug更多，margin的叠加、负值的margin更难理解，margin-bottom这样的东西常常产生浏览器的差异。但并不是建议摈弃margin而使用padding，同样也不要摈弃padding而只使用margin，因情况而异，它们各有所长。

--------------------------------------

默认值，我们一般称之为：css reset，你可以到网上查到很多相关资料以及它的衍进。

作者: 14px 发布时间: 2010-09-07

记着margin-top是有问题的，不过老记不住是哪个浏览器有问题