浏览器兼容性测试方案_常见浏览器兼容性问题_多浏览器兼容测试策略(11)

具体嵌套写法

遵循上面得嵌套方式，<div><ul><li></li></ul></div>然后在CSS 里面告诉 ul {Margin:0pxadding:0px;list- style:none;}，其中list-style:none是不让<li>标记的最前方显示圆点或者数字等目录类型的标记，因为IE和 Firefox显示出来默认效果有些不一样。因此这样不需要做任何手脚，你的IE6、和IE7、Firefox显示出来的东西(外距，间距，高度，宽度) 就几乎没什么区别了，也许细心的你会在某一个时刻发现一、两个象素的差别，但那已经很完美了，不需要你通过调整大片的CSS来控制它们的显示了，你愿意， 你可以仅仅兼容一两个地方，而且通常这种兼容可以适应各种地方，不需要你重复在不同的地方调试不同的兼容方式–减轻你的烦。你可以ul.class1, ul.class2, ul.class3{xxx:xxxx}的方式方便的整理出你要兼容的地方，而统一兼容。尝试一下吧，再也不要乱嵌套了，虽然在DivCSS的方式下你几乎可以想怎么嵌套就怎么嵌套，但是按照上面的规律你将轻松很多，从而事半功倍！

去掉ie有默认最低高度

<div style="height:2px;background:red;overflow:hidden;"></div>

其中height:2px为你要设的高度，overflow:hidden最为关键，他就是帮你去掉默认高度

随着最新CSS的不断完善，越来越多的网站采用DIVCSS布局。而原来使用table套 table的网页布局模式也逐渐应该淘汰了。由于目前IE6不能支持有些标准的CSS，需要用微软特有的CSS来修复这些BUG.而且现在随着浏览器层出不穷，要是页面能够适应尽量多的浏览器成为一个课题。但是随着CSS标准的进一步完善，浏览器将最终都会遵循这个标准，到时候写DIVCSS布局的页 面就不那么麻烦了。

但是现在，我们还是需要处理CSS在不同浏览器下的兼容性。一下是一个网友写的CSS兼容技巧，得大家参考。

CSS兼容技巧

1FF下给 div 设置 padding 后会导致 width 和 height 增加, 但IE不会.

可用important解决

2居中问题.

1).垂直居中.将 line-height 设置为 当前 div 相同的高度, 再通过vertical-align: middle.( 注意内容不要换行.)

2).水平居中. margin: 0 auto;(当然不是万能)

3若需给 a 标签内内容加上样式, 需要设置 display: block;(常见于导航标签)

4FF 和 IE 对 BOX 理解的差异导致相差 2px 的还有设为 float的div在ie下 margin加倍等问题.

5ul 标签在 FF 下面默认有list-style 和 padding . 最好事先声明, 以避免不必要的麻烦. (常见于导航标签和内容列表)

6作为外部 wrapper 的 div 不要定死高度, 最好还加上 overflow: hidden.以达到高度自适应.

7关于手形光标. cursor: pointer. 而hand 只适用于 IE.

针对firefox ie6 ie7的css样式

现在大部分都是用!important来hack，对于ie6和firefox测试可以正常显示，

本文来自电脑杂谈，转载请注明本文网址：
http://www.pc-fly.com/a/jisuanjixue/article-39333-11.html