当前位置: 代码迷 >> Web前端 >> 关于IE6上背景图片固定定位不起作用失效的原因
  详细解决方案

关于IE6上背景图片固定定位不起作用失效的原因

热度:4   发布时间:2012-09-01 09:33:02.0
关于IE6下背景图片固定定位不起作用失效的原因

要写一个空间代码,实现的效果之一就是背景图片固定在页面上,不随浏览器滚动而滚动,但是却遇到了一个问题,就是IE6下背景图片固定不起作用了(IE7,firefox火狐浏览器等都可实现背景固定)。

这是很奇怪的,以前用同样的代码是一点问题都没有的,这次为何不行呢?

待我慢慢叙来……

使背景图片固定代码如下:

body{background:url(xx.jpg) fixed 50% 50%;}

在各个浏览器下的表现都是背景固定,您有兴趣可以随便找一张图试试。

但是,今天同样的针对body的代码却没有用,问什么呢?

原来是common.css里面什么样式产生了影响。好,现在删除common样式,看看哪儿有问题。

结果才删除第一行,就显示OK了,

看来是common.css样式的第一行有问题啊:

?

第一行内容如下:

body,html{margin:0;padding:0}

?

很一般般的样式定义吗?

可我一把“,html”删除,结果显示好了,我顿时豁然开朗。由于对HTML进行了样式定义,IE6就把HTML当做根节点处理了,结果background:fixed就不管用了,后首行代码修改如下,就一切显示正常的啦!

body{margin:0;padding:0}

?

总结:之所以IE6下背景图片固定定位不起作用失效,是因为样式文件里对html标签进行了一些定义,从而使html标签变成根节点,body为非根节点,导致IE6下背景图片固定定位不起作用失效。

  相关解决方案