DIVCSS样式在IE60浏览器中常见问题解决方法

DIVCSS样式在IE6. 0浏览器中常见问题解 决方法 DivCSS样式如今已经飞入了各大网站设计行业。对于新 手来说虽然已经把样式标签与样式代码熟记于心，但是编辑 出来的网站与预先设计还有一段差距。尤其是涉及到不同的 浏览器时，在编写时必须对各个浏览器的显示效果进行测 试。由于IE6.0在出现时，CSS样式还只是初级发展阶段， 有很多功能与效果实现与后面的浏览器有所不同。故在 DIVCSS样式编写时要着重解决相关问题。 1、解决IE6. 0当中网页居中的问题 为了网页可以更加美观适应性强，一般网站在制作网页 时，会让整体网页居中对齐。以前在使用表格布局的时候， 要让一个网站居中对齐是非常简单的。只需要设置表格居中 对齐就可以实现效果。使用divCSS样式其实原理是类似的, 只是方法不同。比如 top{width 900； margin 0 auto； } 网站制作完成后，在各种不同浏览器当中使用，会发现 IE6.0依然是左对齐，无法实现居中对齐。在这句代码中是 利用auto来现实居中对齐的，意思是左边与右边宽度随意。 在IE7. 0及其以后的版本当中，会对左右宽度随意进行平均 分配。也就是说如果你的网页宽度为900像素，浏览器宽度 为1100像素，那么浏览器会自动算出两边宽度分别为150o 这样就可以现实居中对齐的效果。但是在IE6. 0当中对auto 却无法解析。对于这个问题，可以借用text-align来解决。 对上述代码修改后如下 top {width 900； margin 0 auto； text-align center；} 2、使用float浮动容器后IE6.0不适应问题 为了方便divCSS样式代码可以适用于各种浏览器，一 般在代码编写时会使用float浮动容器。比如 left float left； width 240； } 设置完成后，在IE7.0与火狐等浏览器中两个页面展示 出来的效果基本上相差不大。但在IE6.0中使用浮动容器后 会在右侧多出2-3像素左右的高度。 如果把这段代码稍加修改 left float left； width 240； height 300} 设置完成后发现右侧的空白高度不见了，而左侧则多少 相应的高度。这个问题是IE6.0本身程序的问题。在IE6. 0 时代CSS仅仅是用来增加网页美观的代码。要解决这个问题 可以考虑在float浮动容器里加入_margin-right属性。修 改方法如下 left float left； width 240； _margin-right -3px； } 当然，如果要确保在IE6. 0, IE7. 0及火狐当中效果都 保持一致，可以采用下列代码 left float left； width 240；} *html left { float left ； width 240 ； _margin-right -3px； } *html left { float left； width 240；} 上列代码中，*html为IE6. 0独有的标签，而*html又 为IE7. 0独有的标签。这样就可以对三种不同内核的浏览器 进行有针对性的设置。对于出现其它浏览器不一致，需要单 独设置的情况，这个方法同样有效果。 3、解决IE6.0中双倍边距的问题 在写CSS样式代码时，经常会遇上明明只设置了 10像 素的大小，结果在显示时却变成了 20像素。这是怎么回事 呢如下面这段代码 left float left； width 240； margin 0 0 0 lOpx； display inline； } 在显示时就会出现比较大的偏差。要先说明这个问题， 首先要清楚block与inline两个元素。在CSS样式中block 是指块元素。块元素的特点就是可控制性，无论是高度、宽 度还是上下左右的边距都是可控的。Inline元素字面的意思 是在一条线上的元素，也就是专业上所说的内嵌元素，内嵌 元素对整体的效果是不可控制的。而多出的10像素就是不 可控制的自动产生的边距。针对这个情况，可以作下列更改 left float left； width 240； margin 0 0 0 lOpx； display block； display inline； } 在网页中与这种情况比较相似还有。比如，直接在标签 当中使用imgo在底部会多出一点空白的位置。这种情况也 可以加入代码display block来解决。 4、在IE6.0下运行不正堂的注释。 Css注释有时候在IE7. 0、火狐下运动正常，但到了 IE6. 0 中确所有的效果都无法显示出来。这主要是IE6.0对某些注 释无法翻译。所以建议在CSS当中的注释应该以下面方式写 出来 /*这里是某某注释内容*/ 样式脚本的编写还有很多需要注意的地方。但只要大家 注意细节，每个人都会成为一个优秀的网站编辑员。