Mengapa imej tidak dipaparkan dalam VS Code Live Server?
P粉710454910
P粉710454910 2023-07-19 15:47:02
0
1
507

Saya mempunyai masalah dengan Pelayan Langsung dalam Kod VS.

Apabila saya menggunakan logo pada bar navigasi dalam kod HTML saya, ia berfungsi dengan baik apabila membuka fail tanpa menggunakan Pelayan Langsung. Tetapi apabila saya cuba membukanya menggunakan Pelayan Langsung, ia tidak muncul. .

  1. Ini kod HTML saya
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>World Web</title>
    <link rel="stylesheet" href="css/style.css" />
    <!--Boostrap Linked-->
    <link
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css"
      rel="stylesheet"
      integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65"
      crossorigin="anonymous"
    />
  </head>
  <body>
    <!--Nav Bar section Start-->
    <div>
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark container">
      <a class="navbar-brand" href="">
        <img src="../World Web/img/Brand/dark logo.svg" alt="logo" width="120" height="60">
      </a>
        <button
          class="navbar-toggler"
          type="button"
          data-bs-toggle="collapse"
          data-bs-target="#navbarSupportedContent"
          aria-controls="navbarSupportedContent"
          aria-expanded="false"
          aria-label="Toggle navigation"
        >
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
          <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
            <li class="nav-item">
              <a class="nav-link active" href="#">Home</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">About</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Services</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Contact us</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#">Download</a>
            </li>
            
            
          </ul>

        </div>
    </nav>
  </div>
    <!--Nav Bar section End-->

    <!--Hero section Start-->

    <!--Hero section End-->

    <!--AboutUs section Start-->

    <!--About us section End-->

    <!--Footer section Start-->

    <!--Footer section End-->

    <!--Java Script-->
    <script
      src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"
      integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4"
      crossorigin="anonymous"
    ></script>
  </body>
</html>
  1. Ini ialah output apabila dibuka dalam Chrome tanpa menggunakan Pelayan Langsung.

  2. Ini adalah output apabila dibuka menggunakan Pelayan Langsung.

Apabila membuka fail menggunakan Pelayan Langsung, logo dalam bar navigasi saya tidak boleh dipratonton. Walau bagaimanapun, apabila saya membuka fail tanpa menggunakan Pelayan Langsung, ia berfungsi dengan baik.

P粉710454910
P粉710454910

membalas semua(1)
P粉238433862

Jangan gunakan sebarang ruang antara nama fail atau folder.

<img src="../World Web/img/Brand/dark logo.svg" alt="logo" width="120" height="60">

Sama ada gunakan dark_logo.svg atau dark-logo.svg, perkara yang sama berlaku untuk World Web.

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan