背景图像作为固定背景

html
css

2014-03-27 216 views 0 likes

我不知道为什么我的背景图像没有显示。我无法看到开发工具中的图像，我很难过。它位于文件夹中并指向正确的文件夹。任何帮助表示赞赏！这里是我的代码：背景图像作为固定背景

HTML：

<body> 
<div class="l-head-backImage"></div> 

<div class="container"> 
    <header> 
     <h1>This is the Header</h1> 
    </header> 
</div><!-- container -->

CSS：

.l-head-backImage { 
background: url(../images/Seattle.svg) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
}

来源

2014-03-27 Waymond

回答

你告诉它覆盖DIV;但是，div没有实际大小，因为它没有内容。因此，您需要指定div的宽度和高度，以便图像实际上可以覆盖。

实例与您的代码和随机狗图片：JS Fiddle

CSS

.l-head-backImage { 
    background: url(../images/Seattle.svg) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    height: 300px; 
    width: 300px; 
    }

来源

2014-03-27 04:09:07

尝试过了，它仍然没有工作。它看起来像是被推到页面上方。我正在使用骨架网格。我不知道这个信息是否与这个问题有关。谢谢您的帮助。 – Waymond

如果图片被推送，也许你在一个包装页面中使用边距样式？我不会对Skeleton Grid有所帮助，但是您可以在js小提琴中看到图像至少会显示宽度和高度。 –

当然。谢谢！ – Waymond

背景图像作为固定背景

回答

相关问题