我为我构建的WordPress网站创建了一个视差滚动效果。使用了以下 html 和 css：
.html
<div class="container-above"></div>
<!-- Parallax Container element -->
<div class="parallax"></div>
<div class="container-below"></div>
.css
.parallax {
/* The image used */
background-image: url("https://mywebsite.com/wp-content/uploads/2017/12/image.png");
/* Set a specific height */
height: 500px;
/* Create the parallax scrolling effect */
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}
我转到该页面，但图像没有出现。我转到"检查"并收到以下错误：
(索引)：1 混合内容：位于"https://mywebsite.com/"处的页面是 通过 HTTPS 加载，但请求了不安全的图像 "http://localhost/wpthemes/wordpress/wp-content/uploads/2017/12/image.png"。 此内容也应通过 HTTPS 提供。img.png 加载失败 资源： 净：：ERR_CONNECTION_REFUSED
这基本上意味着由于图像不在 https url 下，chrome 不会显示它，因为从技术上讲它不安全。这没有多大意义，因为我用于图像的网址是从我正在使用它的wordpress网站的媒体库中提取的https。
所以我去"查看页面源代码"，果然，在 style.css 文件中，它正在拉取 localhost 链接"http://localhost/wpthemes/wordpress/wp-content/uploads/2017/12/image.png"而不是 wordpress 图像链接。
所以我回到 FTP 中的样式.css工作表，但 css 仍然是一样的：
.parallax {
/* The image used */
background-image: url("https://mywebsite.com/wp-content/uploads/2017/12/image.png");
/* Set a specific height */
height: 500px;
/* Create the parallax scrolling effect */
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}
有人能对此有所了解吗？首先，我认为这是缓存问题，但是我在chrome中以隐身模式加载了该网站，并得到了相同的效果和错误。
我感觉我需要用wordpress做一些事情，也许是将图像插入html而不是css，但我还没有遇到任何具体的事情。
提前感谢您的帮助。
为此，您可以使用PHP函数get_stylesheet_directory_uri()来帮助您设置相对路径。
get_stylesheet_directory_uri()：检索当前主题/子主题的样式表目录 URI。检查 SSL。
把这个PHP放在你的HTML里：
<?php echo get_stylesheet_directory_uri(); ?>
它会回响您当前的stylesheet directory。
之后，比较image path和stylesheet path并执行以下操作：
<img src="<?php echo get_stylesheet_directory_uri(); ?>/images/aternus.png" alt="" width="" height="" />
或者，在找出sylesheet path后，您可以像这样为imageCSS编写relative path：
background-image: url('./../uploads/2017/12/image.png');
// explanation: /. means current folder, ../ means one folder back (up)
@logos_164
如果您最近将此站点从本地开发人员移动到实时站点，我建议您在设置>>常规下签入您的wp-admin，并查看您的WordPress地址(URL)和站点地址(URL)的设置。
(有时人们会导出他们的本地dev sql wordpress数据库，忘记在站点URL上进行查找/替换，最终所有设置都是localhost或*.dev)
如果这些地址都不是本地主机，那么这不是问题。 虽然我会进行 sql 导出并在文件中搜索对本地主机的任何引用，以防万一有一个设置/字段仍然与本地主机相关。
如果您最近确实将其从本地开发人员移动到实时站点，我还会重做我的永久链接设置以重置 .htaccess 文件。
最后的手段可能是通过ftp将图像上传到托管环境中的文件夹，并在您的样式中引用该位置.css而不是使用wordpress媒体上传文件夹。