CSS背景没有显示IE 8及更早版本

时间:2022-11-03 08:53:26

My problem here is, that my background loads perfectly fine in almost all browsers except for IE8 and below. The page can be seen here: http://www.glnyrupvej.co.nf/ Here is a screenshot of the page in IE8: Page in IE8

我的问题是,除了IE8及以下版本之外,几乎所有浏览器的背景都非常好。该页面可以在这里看到:http://www.glnyrupvej.co.nf/这是IE8页面的截图:IE8中的页面

Here is my CSS:

这是我的CSS:

height: 700px;
padding-top: 50px;
background: url(images/fraluften.png) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;

Yes, i do realize that there is other questions like this, but none of them could help me.

是的,我确实意识到还有其他这样的问题,但没有一个可以帮助我。

This is probably something super basic that i just overlooked, so answers is appreciated! (:

这可能是我忽略的超级基础,所以答案非常感谢! (:

1 个解决方案

#1


0  

background-size: cover; is a css3 property so it will not work in IE8 or earlier versions.Better try to achieve it using image tag like this:

背景尺寸:封面;是一个css3属性,所以它不能在IE8或更早版本中工作。更好的尝试使用像这样的图像标签来实现它:

Your header html code

你的标题html代码

    <header>
            <center>
    <img src="images/fraluften.png" class="backgroundClass">
<img src="images/scrolldownB.png" id="scrolldownB" style="display: inline;">
            </center>
            </header>

CSS for backgroundClass

backgroundClass的CSS

.backgroundClass{
    display: inline;
    height: 700px;
      position: fixed;
      top: 0;
    width: 100%;
    left: 0;
    z-index: -1;
    }

#1


0  

background-size: cover; is a css3 property so it will not work in IE8 or earlier versions.Better try to achieve it using image tag like this:

背景尺寸:封面;是一个css3属性,所以它不能在IE8或更早版本中工作。更好的尝试使用像这样的图像标签来实现它:

Your header html code

你的标题html代码

    <header>
            <center>
    <img src="images/fraluften.png" class="backgroundClass">
<img src="images/scrolldownB.png" id="scrolldownB" style="display: inline;">
            </center>
            </header>

CSS for backgroundClass

backgroundClass的CSS

.backgroundClass{
    display: inline;
    height: 700px;
      position: fixed;
      top: 0;
    width: 100%;
    left: 0;
    z-index: -1;
    }