div+css扩展框问题浮动下降IE与Firefox兼容性.docVIP

div+css扩展框问题浮动下降?IE与Firefox兼容性IE6 的BUG 真让人头疼。。整理一些浏览器兼容问题，以备不时之需。1.图文混排，容易导致 扩展框问题. divimg src=/qz.q/images/index_1.jpg /扩展框问题/div 这样排版容易导致 扩展框问题. 尽量定义宽高给定值： * 浮动下降问题[size=+0] 加上 ｛float：left；｝ 即可``` ? 2.IE6的双倍边距BUG ： 解决办法是加上display:inline? 定义页面内容显示方式的属性有两个：display属性和visibility属性。 display属性是用来确定页面元素是否显示和显示方式。 display 属性规定元素应该生成的框的类型。? display属性的取值很多，我们仅将比较常用的一些做一下介绍。 ·none：隐藏对象，同时元素所占有的空间也被清除了。 ·block：定义元素为块对象。 ·inline：定义元素为内联对象。将对象强制作为内联对象呈递，从对 象中删除行 ·list-item：定义元素为列表项目。 ·inline-table:CSS2未支持。将表格显示为无前后换行的内联对象或 内联容器? 所有可视的文档对象都是块对象(block element)或者内联对象(inline element)。例如， div 是一个块对象。 span 是一个内联对象。块对象的特征是从新的一行开始且能包含其他块对象和内联对象。内联对象被呈递时不会从新行开始，能够包含其他内联对象和数据。? 改变此属性值对其周围内容布局的影响可能是： ·在属性值设为 block 的对象后面添加新行。 ·从属性值设为 inline 的对象中删除一行。 ·隐藏属性值设为 none 的对象并释放其在文档中的物理空间。? 3.IE6下为什么图片下方有空隙产生 解决这个BUG的方法也有很多，可以是改变html的排版，或者设置img 为display:block或者设置vertical-align属性为vertical-align:top | bottom |middle |text-bottom都可以解决.? 4.IE6下这两个层中间怎么有间隙 这个IE的3PX BUG也是经常出现的，解决的办法是给.right也同样浮动 float:left 或者相对IE6定义.left? 5.如何对齐文本与文本输入框 遇到此种问题，设置文本框的 vertical-align:middle 就可以了? 6.为什么FF下文本无法撑开容器的高度 [size=+0] 标准浏览器中固定高度值的容器是不会象IE6里那样被撑开的,那我又想固定高度，又想能被撑开需要怎样设置呢？办法就是去掉height设置min-height:200px; 这里为了照顾不认识min-height的IE6 可以这样定义： { height:auto!important; height:200px; min-height:200px; }? 7.怎么样才能让层显示在FLASH之上呢 解决的办法是给FLASH设置透明 param value=/qz.q/transparent /或者 param value=/qz.q/opaque /8.怎样使一个层垂直居中于浏览器中 使用百分比绝对定位，与外补丁负值的方法，负值的大小为其自身宽度高度除以二. 方法二:首先在父级元素定义text-align: center;这个的意思就是在父级元素内的内容居中；对于IE这样设定就已经可以了。 但在mozilla中不能居中。解决办法就是在子元素定义时候设定时再加上margin-right: auto; margin-left: auto; 需要说明的是，如果你想用这个方法使整个页面要居中，建议不要套在一个DIV里，你可以依次拆出多个div， 只要在每个拆出的div里定义margin-right: auto; margin-left: auto;就可以了。 { width:300px; margin-left:auto; margin-right:auto; }9.针对firefox ?ie6 ie7的css样式 现在大部分都是用!important来hack，对于ie6和firefox测试可以正常显示， 但是ie7对!important可以正确解释，会导致页面没按要求显示！找到一个针 对IE7不错的hack方式就是使用*+html，现在用IE7浏览一下，应该没有问题了。现在写一个CSS可以这样： #1 { color: #333; } * html #1 { color: #666; } *+html #1 { color: #999; } 那么在firefox下字体颜色显示为#333，IE6下字体颜色显