Question

我在2天前制作了一个简单的网站，由于某种原因，今天它没有加载任何资源，如图片，CSS和视频。

这是我的代码：

<html lang="en" class="fa-events-icons-ready">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Raut</title>
    <link rel="shortcut icon" href="//static/misc/favicon.ico">
    <link rel="stylesheet" href="//static/misc/styles.css">
    <link rel="stylesheet" href="//static/misc/btn.css">
</head>

<body>
    <video id="byiwmemes" autoplay="autoplay" loop="loop">
        <source src="//static/top21.mp4" type="video/mp4">
    </video>
    <h1><img src="//static/misc/logo.png" class="logostyle"></h1>
    <div id="buttons">
        <a href="//facebook.com/rautw" class="btn blue">Facebook</a>
        <a href="//steamcommunity.com/id/raut__/" class="btn orange">Steam</a>
    </div>
</body>

</html>

Here's what displays in the console

Answer 1

引用静态文件时不要使用//。 //用于选择带外部资源的http或https。

将每个对//的引用更改为/。 e.g。

<link rel="shortcut icon" href="//static/misc/favicon.ico">

到

<link rel="shortcut icon" href="/static/misc/favicon.ico">

但是，您可以将指向Facebook（外部）的链接保留为//

编辑：完整的固定代码：

<!doctype html>
<html lang="en" class="fa-events-icons-ready">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Raut</title>
    <link rel="shortcut icon" href="/static/misc/favicon.ico">
    <link rel="stylesheet" href="/static/misc/styles.css">
    <link rel="stylesheet" href="/static/misc/btn.css">
</head>

<body>
    <video id="byiwmemes" autoplay="autoplay" loop="loop">
        <source src="/static/top21.mp4" type="video/mp4">
    </video>
    <h1><img src="/static/misc/logo.png" class="logostyle"></h1>
    <div id="buttons">
        <a href="//facebook.com/rautw" class="btn blue">Facebook</a>
        <a href="//steamcommunity.com/id/raut__/" class="btn orange">Steam</a>
    </div>
</body>

</html>

Answer 2

使用//启动URI是省略 URI方案的简写，并将根据页面本身加载的方案解析方案，通常为{{1} }或http，并且需要域和路径，因此所有https路径都无法解析，因为//static/…不是域。

有关部分URI如何解析的快速参考，请参阅this answer。

HTML / CSS网站不加载任何资源

2 个答案: