为什么background-image在一个地方工作，但在另一个地方不工作？

-1

我工作的一些自定义的WordPress主题，在我的style.css我有两个地方我使用的背景图片，在这里它工作正常：为什么background-image在一个地方工作，但在另一个地方不工作？

#gallery { 
background-attachment: fixed; 
background-position: center; 
background-repeat: no-repeat; 
background-size: cover; 
background-image: url("img/gallery.jpg"); 
min-height: 100vh; 
padding-top: 50px; 
color: white; 
text-align: center; 
}

，但在这里不显示：

#pageHeader { 
background-image: url("img/pageHeader.jpg"); 
overflow: auto; 
overflow-y: hidden; 
text-align: center; 
padding-top: 30px; 
padding-bottom: 30px; 
}

其次是针对page.php文件，其他功能如文本对齐工作正常，只有问题是与背景图像。当然，两个jpgs都在同一个位置。

我检查了，它给“无法加载图片”

来源

2016-10-11 egzaell

它被另一种风格所覆盖吗？你使用过浏览器的检查员了吗？打F12。 – LeonardChallis

尝试使用类似'url（“../ img/pageHeader.jpg”）'的URL。和/或重新检查图像的名称和它的位置。 –

不起作用，Firefox检查员说“无法加载图像”，但其括号中的加载 – egzaell

从你的描述几种可能的问题即可。例如，该规则可能根本不适用，因为#pageHeader不存在（无论出于何种原因，包括但不限于拼写错误）。或者该规则可能适用于#pageHeader，但另一个规则将覆盖background-image。此外，它有可能位于iframe之内，其中图片的相对位置不同（如果iframe中的页面与主页面不在同一文件夹内，且不在兄弟文件夹中）。此外，由于浏览器缓存（清除浏览器缓存）或服务器缓存系统（如CloudFlare），未应用的规则可能不可用。

解决方法是右键单击HTML标记，单击Inspect并查看应用了哪些CSS规则。如果应用此规则，那么至少您知道您使用的是正确版本的CSS，并且可以查看图像的加载位置。当你达到这一点时，解决方案应该是显而易见的。

来源

2016-10-11 08:19:38

好的，所以解决方法是 - 我在ubuntu上使用lampp，并且在某些方面它不工作，但移回到windows xampp解决了这个问题。它可能是有权限的东西。

来源

2016-10-12 07:44:02 egzaell

为什么background-image在一个地方工作，但在另一个地方不工作？

回答

相关问题