"专业 CSS兼容IE和Firefox技巧集合"

！DOCTYPE html＞ 　＜html＞ 　　＜head＞ 　　＜style type="text/css"＞ 　　.div1{float:left; margin:20px;} 　 .div2{float:left; margin:20px; display:inline;} 　　＜/style＞ 　　＜/head＞ 　＜body＞ 　　＜div class="div1"＞div1＜/div＞ 　 ＜div class="div2"＞div2＜/div＞ 　＜/body＞ 　＜/html＞ 　　3.双边距 　　在 ie6 下面设置了 margin 和 float，还会出现一个叫双边距的 bug。解决方案是将 display:inline; 样式加到这个 div 里。 　　4.列表导航的不同表现 　　在火狐中～浮动宽度等于的li的溢出隐藏 　 ＜!DOCTYPE html＞ 　＜html＞ 　　＜head＞ 　　＜style type="text/css"＞ 　　.menu{overflow:hidden;} 　 .menu li{float:left; margin:5px;} 　 ＜/style＞ 　　＜/head＞ 　＜body＞ 　　＜ul class="menu"＞ 　　＜li＞li1＜/li＞ 　 ＜li＞li2＜/li＞ 　＜/ul＞ 　＜/body＞ 　＜/html＞ 　　5.min-height的表现 　　在 ie 中有一个 min-height 的表现是在 ie 下要设置的 height:100%  否则无效 　　6.链接问题 　　a 链接没办法改变 a 链接的高和宽  边框设置了之后背景颜色也设了，但是在 ie 下的 a 链接不会撑开盒子。 ie6 需要加上 display:block 或 float:left; 　　7.浮动  在 ie 中有个浮动不清的问题  当父级 div 上没有设置高度，而里面的子 div 设置了 float 就会出问题，容易清除的方法是设置父级 div 的 overflow:hidden 属性 　 8.border的加倍 　 在 ie 下边界的 doubled 是因为 border-style：dashed的值让边界加倍。此时改成其他值会正常显示单条边框 　 9.列表中的span bug  在 ie 中一个列表加上 span 标签，前面会多出一个列表表现。解决也可以在 span 标签中加上 display:block 解决 　 10.css hack 笼统来说就是识别不同浏览器的技巧方法  如下图所示： ＜!DOCTYPE html＞ 　 ＜html＞ 　 ＜head＞ 　 ＜style type="text/css"＞ 　 .width{width:200px;}/*正常浏览器*/ 　 * html .width{width:180px;} /*只有IE6执行*/ 　 ＜/style＞ 　 ＜/head＞ 　 ＜body＞ 　 ＜div class="width"＞ ＜span＞我是200px宽的容器＜/span＞ ＜/div＞ ＜body＞ 　 ＜html＞ 这些技巧可以帮助网页设计师更好地处理CSS兼容IE和Firefox的问题，确保网站在不同浏览器上的正常显示。如果学习并掌握了这些技巧，就能够更加轻松地应对不同浏览器的兼容性问题，提高网页的用户体验。因此，对于有关CSS兼容性的问题，建议网页设计师和开发人员积极学习并熟练掌握这些技巧，以便更好地在实际工作中应用。