div错位解决IE6、IE7、IE8样式不兼容问题IE6里DIV错位问题.docxVIP

采用”FLOAT：LEFT“的DIV在IE8、IE7、都没问题，IE6下却向下移动，出现空白。这是因为，IE6采用的内核默认把DIV之间的距离增加了3~5个PX，所以，试试是将下移的DIV的STYLE里增加margin-left:-5px;或者更小。解决IE7、IE8样式不兼容问题 方法一、要在页面中加入如下HTTP meta-tag: meta http-equiv=X-UA-Compatible content=IE=EmulateIE7 / 只要IE8一读到这个标签，它就会自动启动IE7兼容模式，保证页面完整展示。 方法二、针对整个网站，在IIS中加入如下描述符就可以有相同的效果，当然这么做范围更广。 ?xml version=1.0 encoding=utf-8?configurationsystem.webServerhttpProtocolcustomHeadersadd name=X-UA-Compatible value=IE=EmulateIE7/customHeaders/httpProtocol/system.webServer/configuration 解决IE6、IE7、IE8样式不兼容问题 现在我们在做网页的时刻总是要考虑一些浏览器之间的兼容问题。近期在做一个短信平台的项目。在项目的开发过程中让我遇到了一件头痛的事情就是IE7与IE8不兼容。后面想了许多办法得以解决。现共享如下： 如果你的页面对IE7兼容没有问题，又不想大量修改现有代码，同时又能在IE8中正常使用，微软声称，开发商仅需要在目前兼容IE7的网站上添加一行代码即可解决问题，此代码如下： CODE: meta http-equiv=x-ua-compatible content=ie=7 / ? 解决firefox ie6 ie7的css样式兼容问题 做主题最麻烦的就是CSS样式兼容问题，由于各浏览器对ccs的不同解释，造成本来IE7可正常显示，但到了Firefox 、ie6等其它浏览器上，却出现错位、下沉等问题，只得在Firefox 、ie6 、ie7之间不停的切换调试，汗…最近又有两款浏览器加入googleChrome和IE8,某个浏览器一统天下看来是没希望了，只能尽量克服兼容问题。 找到一篇解决兼容问题的文章，还是很有效的。 1 针对firefox ie6 ie7的CSS样式 现在大部分都是用!important来hack，对于ie6和firefox测试可以正常显示，但是ie7对!important可以正确解释， 会导致页面没按要求显示！找到一个针对IE7不错的hack方式就是使用“*+html”，现在用IE7浏览一下，应该没??问题了现在写一个CSS可以这 样： #1 { color: #333; } /* Moz */ * html #1 { color: #666; } /* IE6 */ *+html #1 { color: #999; } /* IE7 */ 那么在firefox下字体颜色显示为#333，IE6下字体颜色显示为#666，IE7下字体颜色显示为#999。 2 css布局中的居中问题 主要的样式定义如下： body {TEXT-ALIGN: center;} #center { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; } 说明： 首先在父级元素定义TEXT-ALIGN: center;这个的意思就是在父级元素内的内容居中；对于IE这样设定就已经可以了。 但在mozilla中不能居中。解决办法就是在子元素定义时候设定时再加上“MARGIN-RIGHT: auto;MARGIN-LEFT: auto; ” 需要说明的是，如果你想用这个方法使整个页面要居中，建议不要套在一个DIV里，你可以依次拆出多个div，只要在每个拆出的div里定义MARGIN-RIGHT: auto;MARGIN-LEFT: auto; 就可以了。 3 盒模型不同解释. #box{ width:600px; //for ie6.0- w\idth:500px; //for ff+ie6.0 } #box{ width:600px!important //for ff width:600px; //for ff+ie6.0 width /**/:500px; //for ie6.0- } 4 浮动ie产生的双倍距离 #box{ float:left; width:100px; margin:0 0 0 100px; //这种情况之下IE会产生200px的距离 display:inline; //使浮动忽略} 这里细说一下block,inline两个元素,Block元素的特点是:总是