元素在网络服务器上消失答案

【问题标题】：Elements disappear on webserver元素在网络服务器上消失
【发布时间】：2016-11-11 08:59:40
【问题描述】：

我有一个从网络获取的 HTML 文件，当我在本地打开它时，一切看起来都很棒，但是如果你将文件上传到网络服务器，一半的元素会从页面中消失。更重要的是，一些导航器似乎能够显示元素，而其他导航器则不能。例如，IE 显示所有内容，而 Chrome 和 Opera 则不显示。代码如下：

<div class="top-ads row">
<div class="col-md-4 sec-heading">Top Ads</div>
<div class="col-md-4"></div>
<div class="col-md-4">
    <a class="left-arr-btn right carousel-control" href="#carousel-example-generic" data-slide="prev" >
    <img class="left-arr-img" src="images/left-arrow.png">
    </a>

    <a class="right-arr-btn right carousel-control" href="#carousel-example-generic" data-slide="next">
    <img class="right-arr-img" src="images/right-arrow.png">
    </a>
</div>
</div>

似乎所有的顶级广告都有问题，这是样式：

.top-ads{
margin-top: 2em;
}

我不明白，如果它从磁盘显示正常，为什么它在网络上显示为空白？我会尝试添加一些屏幕截图... Working Not working

【问题讨论】：

你确定图片还能加载吗？我很确定这与 CSS 无关......（实际上考虑到非图像元素的隐藏方式，它可能与 CSS 有关）
是的，一半加载了，另一半没有，你可以在截图上看到
您可以在此处找到该页面：all4truck.com/done

标签： html css image class styles

【解决方案1】：

也许您应该检查您的images 文件夹是否在服务器上的正确位置。

你也可以尝试给出一个相对路径，通过替换这个：

src="images/left-arrow.png"

通过这个：

src="../../images/left-arrow.png"

或返回您网站根目录的等效相对路径。

【讨论】：

也是个好主意。您的网站上是否有未显示图像的“图像”目录？
我假设我的图像在那里，因为一半的图像正在加载，实际上，IE 甚至可以加载所有的图像...... :(
是图像格式的东西吗？（不太可能，但谁知道）

【解决方案2】：

您是否提供了所有代码？如果是这样，您没有 doctype 声明，也没有 html 或 body 标签 - 现代浏览器会原谅这一点，但旧浏览器不会。在此处阅读 html 结构：https://www.w3.org/TR/html401/struct/global.html

这适用于 HTML4：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
   <HEAD>
      <TITLE>My first HTML document</TITLE>
   </HEAD>
   <BODY>
      <P>Hello world!
   </BODY>
</HTML>

如果要运行 html5，请使用以下文档类型：

&lt;!DOCTYPE html&gt;

【讨论】：

不，这不是我的全部代码，当然我有 doctype、html 和 body 标签。您需要更多代码吗？附言我使用最新的 Chrome
如果您不提供所有详细信息，则很难诊断您的问题。
代码又乱又长，可以在 all4truck.com/done 上看到
第二个滑块没有用于幻灯片的 html，因此它永远不会显示任何内容。您需要在 html 中添加图片，以便它们显示。
我已经验证了你的源代码，它很糟糕，有几十个错误。您需要做的是到这里validator.w3.org/nu/#textarea 并验证您的源代码并修复所有错误，然后该页面应该可以在大多数浏览器中运行。