用于视差背景的图像是从http本地主机中提取的，而不是style.css中的wordpress url。
我为我创建的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未能加载资源: net::ERR_CONNECTION_REFUSED
这基本上意味着，由于图像不在下方和https url，铬不会显示它，因为从技术上讲，它是不安全的。这没有多大意义，因为我为图像使用的url是从我正在使用的wordpress站点的媒体库中提取的https。
因此，我转到“查看页面源”，并且确定，在style.css文件中，它正在拉出localhost链接'http://localhost/wpthemes/wordpress/wp-content/uploads/2017/12/image.png‘而不是wordpress图像链接。
因此，我回到FTP中的style.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;
}有人能弄清楚这件事吗？首先，我认为这是一个缓存问题，但我以隐名模式加载了该站点，并获得了相同的效果和错误。
我觉得我需要用wordpress来做一些事情，也许是把图片插入到html中，而不是css中，但是我还没有发现任何具体的东西。
谢谢你提前帮忙。
回答 2
Stack Overflow用户
发布于 2018-01-04 06:58:47
为此，您可以使用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之后，您可以在CSS中为image编写一个relative path，如下所示：
background-image: url('./../uploads/2017/12/image.png');
// explanation: /. means current folder, ../ means one folder back (up)Stack Overflow用户
发布于 2017-12-29 16:31:30
@logos_164
如果您最近将该站点从本地开发移到了一个活动站点，我建议您在Settings>>General下签入what并查看您的WordPress地址(URL)和站点地址(URL)设置的内容。
(有时人们会导出自己的本地dev数据库，忘记在站点url上查找/替换，最终得到的所有设置都是本地主机或*.dev)。
如果这些地址中没有一个是本地主机，那么这不是问题所在。虽然我会执行sql导出，并在文件中搜索对localhost的任何引用，但是如果有一个设置/字段仍然与localhost相关的话。
如果您最近确实将它从一个本地开发工具移到了一个活动站点，我也会重新做我的permalink设置来重置.htaccess文件。
最后一种方法可能是通过ftp将图像上传到宿主环境中的文件夹，并引用style.css中的位置，而不是使用wordpress媒体上传文件夹。
https://stackoverflow.com/questions/48025192
复制相似问题
腾讯云开发者
