Javascript 我的主页中央没有显示分层图像

我正在使用加载gif图像来在加载主页时显示，但是它显示在侧面，如下图所示，我不知道为什么

我的代码：

document.onreadystatechange=function（）{
var state=document.readyState
如果（状态==“交互式”）{
document.getElementById（'contents'）.style.visibility=“hidden”；
}否则如果（状态=‘完成’）{
setTimeout（函数（）{
document.getElementById（'interactive'）；
document.getElementById（'load'）.style.visibility=“hidden”；
document.getElementById（'contents'）.style.visibility=“visible”；
}, 1000);
}
}

#加载{
宽度：100%；
身高：100%；
位置：固定；
背景：url（'../../images/page loader.gif'）无重复中心
}

---

嗯……一个简单的例子是在另一个DIV中推送微调器。类似这样的

div{
显示：块；
文本对齐：居中；
}
跨度{
背景色：红色；
宽度：1米；
高度：1米；
显示：内联块；
}

---

我怀疑你的CSS或HTML中还有其他东西干扰了你的微调器。在下面的示例中，它运行良好

document.onreadystatechange=function（）{
var state=document.readyState
如果（状态==“交互式”）{
document.getElementById（'contents'）.style.visibility=“hidden”；
}否则如果（状态=‘完成’）{
setTimeout（函数（）{
document.getElementById（'interactive'）；
document.getElementById（'load'）.style.visibility=“hidden”；
document.getElementById（'contents'）.style.visibility=“visible”；
}, 2000);
}
}

#加载{
宽度：100%；
高度：100px；
背景：url（'https://68.media.tumblr.com/695ce9a82c8974ccbbfc7cad40020c62/tumblr_o9c9rnRZNY1qbmm1co1_500.gif“）无重复中心；
}

这是我的页面

这与PHP有什么关系？应用程序本身是用PHP编写的，html作为phtmlAre嵌入在PHP中。您正在寻找垂直和水平中心吗？谢谢Alex，但它仍然不起作用，显示相同的内容。您可以在codepen中制作示例，这将更容易帮助您@SMH已加工但去除背景后尺寸：25px；位置：固定；你能更新一下吗，这样我就可以把它标记为答案了？更新了，但是旋转器现在看起来像拥抱了；）